2023-03-01 react-native 实现 复制功能 @react-native-community/clipboard 报错:TypeError: null is not an object (evaluating 'NativeClipboard_1.default.setString')。
我的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步骤。