我的react-native(下称rn)版本为0.68,要实现这个功能主要用到rn的clipboard,在21年的时候他就已经提示clipboard会在未来的版本中上去掉,官方的建议是不要再从react-native引入,而实替换为@react-native-community/clipboard,实现方法详见下面:

1.安装clipboard模块:

yarn add @react-native-community/clipboard

2.在项目中使用:

import Clipboard from "@react-native-community/clipboard";

···

  // 复制事件(需要绑定到button中)
const handleClick = (e) => {
console.log(e);
Clipboard.setString(e)
ToastAndroid.showWithGravityAndOffset(
"内容已复制到剪贴板",
ToastAndroid.LONG,
ToastAndroid.CENTER,
25,
70
);
}

这时候你点击按钮,按钮触发Clipboard,报错:TypeError: null is not an object (evaluating 'NativeClipboard_1.default.setString')。

这是由于你还需要在android包做一些配置,详见下面:

3.打开项目名\android\app\build.gradle,并在里面添加如下代码:

dependencies {
  implementation project(':@react-native-community-clipboard') // 添加这行代码 ...
}

4.打开项目名\android\app\src\main\java\com\app\MainApplication.java,并在里面添加如下代码:

import com.reactnativecommunity.clipboard.ClipboardPackage; // 添加这行代码
 public class MainApplication extends Application implements ReactApplication { ...

5.打开项目名\android\settings.gradle,并在里面添加如下代码:

include ':@react-native-community-clipboard'
project(':@react-native-community-clipboard').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-community/clipboard/android')

6.最重要的一步,卸载现在的版本,重新打包。

最后:第3、4、5步你可以不做,我也不知道这3步是否有效,我是按别人的操作来执行的,我也成功实现了该功能,我建议你报错(TypeError: null is not an object (evaluating 'NativeClipboard_1.default.setString')。)后直接卸载app,然后重新打包看效果,如果没有效果,那就执行3、4、5步骤。

2023-03-01 react-native 实现 复制功能 @react-native-community/clipboard 报错:TypeError: null is not an object (evaluating 'NativeClipboard_1.default.setString')。的更多相关文章

  1. react爬坑之路(一)--报错output.path不是绝对路径

    之前,一直在纠结是学习angular好,学习vue好,还是学习react好,网上一搜索,也是各种对比,各种互喷,看过之后更纠结.就跟小时候一样纠结长大了是上清华好,还是上北大好,最后证明我想多了.总之 ...

  2. 【已解决】React项目中按需引入ant-design报错TypeError: injectBabelPlugin is not a function

    react项目中ant-design按需加载,使用react-app-rewired的时候报错 运行npm start或者yarn start报如下错误: TypeError: injectBabel ...

  3. react报错 TypeError: Cannot read property 'setState' of undefined

    代码如下: class test extends Component { constructor(props) { super(props); this.state = { liked: false ...

  4. React Native在虚拟运行app时,报错RCTRootView not found,怎么解决?

    报错: 解决方案:

  5. react+typescript报错集锦<持续更新>

    typescript报错集锦 错误:Import sources within a group must be alphabetized.tslint(ordered-imports) 原因:impo ...

  6. 【React Native开发】React Native控件之ProgressBarAndroid进度条解说(12)

    ),React Native技术交流4群(458982758).请不要反复加群! 欢迎各位大牛,React Native技术爱好者增加交流!同一时候博客左側欢迎微信扫描关注订阅号,移动技术干货,精彩文 ...

  7. react native-调用react-native-fs插件时,如果数据的接口是需要验证信息的,在android上运行报错

    调用react-native-fs插件时,如果数据的接口是需要验证信息的,在android上运行报错,而在iOS上运行没问题.原因是因为接口是有验证信息的,而调用这个插件时没有传入,在iOS上会自动加 ...

  8. React Native 系列(二) -- React入门知识

    前言 本系列是基于React Native版本号0.44.3写的,最初学习React Native的时候,完全没有接触过React和JS,本文的目的是为了给那些JS和React小白提供一个快速入门,让 ...

  9. React-Native(三):React Native是基于React设计的

    React Native是基于React js设计的. 参考:<React 入门实例教程> React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript ...

  10. 【问题与解决】Mac OS通过 npm 安装 React Native 报错(checkPermissions Missing write access to /usr/local/lib/node_modules)

    报错情况: 当Mac OS通过 npm 安装 React Native 报错,警告文字为:checkPermissions Missing write access to /usr/local/lib ...

随机推荐

  1. eclipse配置JD-Eclipse反编译java的class文件 【2021年最新版使用教程】

    简介 就是像eclipse那样ctrl+左键点击查看源码,不过eclipse本身不带这种插件而已 0x00 下载JD-eclipse 官网:http://java-decompiler.github. ...

  2. Vue 3项目如何设置全局变量

  3. 线程基础知识 03 synchronized锁(对象在内存的布局和加上锁后对象在内存中的变化)

    1 线程不安全演示 public class ThreadAndLockTest1 { private static int a = 0; public static void main(String ...

  4. C++练习9 函数的重载

    函数的重载是用一个函数名定义多个函数,但是这些同名函数的形参列表(参数个数,类型,顺序)必须不同. 函数重载的规则: 1.函数名称必须相同. 2.参数列表必须不同(个数不同.类型不同.参数排列顺序不同 ...

  5. 推荐一款新的自动化测试框架:DrissionPage!

    今天给大家推荐一款基于Python的网页自动化工具:DrissionPage.这款工具既能控制浏览器,也能收发数据包,甚至能把两者合而为一,简单来说:集合了WEB浏览器自动化的便利性和 request ...

  6. 【KAWAKO】从mac上定时将腾讯云的数据备份到本地

    目录 前言 需求 宝塔面板 备份网站 备份数据库 mac端 创建工程文件夹 rua.py rua stdout plist Reference 前言 不信任一切云端平台,把数据牢牢握在自己手中才是最安 ...

  7. JZOJ 2936. 【NOIP2012模拟8.9】逐个击破

    题面 各大 \(OJ\) 都有 分析 从结果入手:所有被敌方军团占领的城市都是分开的 而按最小代价删去若干条边,则剩下的图必然是若干个联通子图组成的 那么我们要使花费最小,可以是留下的边最大 并查集合 ...

  8. select加下拉箭头

    <div class="flex"> <label>城市</label> <div class="dealerbo"& ...

  9. python (),[], {}的含义

    1.python ()表示元组,元组是一种不可变序列 1)创建如:tuple = (1,2,3) 取数据 tuple[0]...... tuple[0,2].....tuple[1,2]...... ...

  10. Error in v-on handler: “TypeError: Cannot read properties of undefined (reading ‘resetFields‘)“

    在做vue element 项目中,做了一个新增 打开弹框的功能,想每次点击新增的时候表单项重置.1.使用了this.$refs[formName].resetFields();2.但是报错了,原因是 ...