react-native - 将世博项目移动到本机反应后,收到警告“componentWillReceiveProps 已重命名”
问题描述
我迁移我的世博项目以响应本机项目。我删除了世博会,并尝试使用本机方式添加启动屏幕和推送通知,并在没有世博会的情况下添加字体。我还安装了没有博览会的原生方式的反应导航。我使用 android studio 和 Xcode 运行该项目。我有一些问题,但我通过在我的 package.json 文件中修复一些包版本来修复它们现在我得到这个错误:
Warning: componentWillReceiveProps has been renamed, and is not recommended for use. See ... for details.
* Move data fetching code or side effects to componentDidUpdate.
* If you're updating state whenever props change, refactor your code to use memoization techniques or move it to static getDerivedStateFromProps. Learn more at: ***
* Rename componentWillReceiveProps to UNSAFE_componentWillReceiveProps to suppress this warning in non-strict mode. In React 17.x, only the UNSAFE_ name will work. To rename all deprecated lifecycles to their new names, you can run `npx react-codemod rename-unsafe-lifecycles` in your project source folder.
Please update the following components: SafeView
我的旧包文件:
"react": "16.8.3",
"react-dom": "^16.8.6",
"react-native": "https://github.com/expo/react-native/archive/sdk-
33.0.0.tar.gz",
"react-native-autocomplete-input": "^4.1.0",
"react-native-elements": "^1.1.0",
....
"react-navigation": "^4.0.10",
"react-navigation-drawer": "^2.3.3",
"react-navigation-material-bottom-tabs": "^1.0.0",
"react-navigation-stack": "^1.10.3",
My current version use safe area context with react navigation :
"dependencies": {
"@react-native-community/async-storage": "^1.7.1",
"@react-native-community/masked-view": "^0.1.6",
"@react-native-community/push-notification-ios": "^1.0.6",
"axios": "^0.19.0",
"buffer": "^5.4.3",
"color": "^3.1.2",
"libphonenumber-js": "^1.7.26",
"moment": "^2.24.0",
"native-base": "^2.13.5",
"native-base-autocomplete": "^1.3.2",
"querystring": "^0.2.0",
"react": "16.9.0",
"react-native": "0.61.5",
"react-native-elements": "^1.1.0",
"react-native-event-source": "^1.1.0",
"react-native-gesture-handler": "^1.5.6",
"react-native-globalize": "^3.0.0",
"react-native-material-textfield": "^0.16.1",
"react-native-modal-selector": "^1.1.1",
"react-native-paper": "^2.16.0",
"react-native-push-notification": "^3.1.9",
"react-native-reanimated": "^1.0.1",
"react-native-responsive-ui": "^2.1.1",
"react-native-root-toast": "^3.1.2",
"react-native-safe-area-context": "^0.7.2",
"react-native-screens": "^2.0.0-beta.2",
"react-native-slider": "^0.11.0",
"react-native-splash-screen": "^3.2.0",
"react-native-vector-icons": "^6.6.0",
"react-navigation": "^4.0.10",
"react-navigation-drawer": "^2.3.3",
"react-navigation-material-bottom-tabs": "^1.0.0",
"react-navigation-stack": "^1.10.3",
"react-redux": "^7.1.0",
"redux": "^4.0.4",
"redux-devtools": "^3.5.0",
"redux-devtools-extension": "^2.13.8",
"redux-thunk": "^2.3.0",
"search-params": "^2.1.3",
"whatwg-url": "^8.0.0"
},
解决方案
在你的情况下,这实际上不是一个错误。这是来自 react native 的警告。
componentWillReceiveProps是一个同步钩子。在此钩子中调用异步函数(如数据获取)需要在设置新道具和数据完成加载之间进行渲染。
因此,不推荐使用componentWillReceiveProps以支持以下原因:
- 使用componentDidUpdate
所以,我建议你尽可能使用 componentDidUpdate 钩子并更新你的代码。
- 比较componentWillMount和componentDidMount时会发生类似的事情。每当您需要操作异步操作并完全忘记componentWillMount时,请使用componentDidMount。
推荐阅读
- docker - Jenkins管道作业,运行docker,不起作用
- android - Fragmnet 中的 RecyclerView 中的项目不出现
- android - 远程视图服务意图上的 setData
- android - 根据开始拖动和结束拖动之间的距离调整视图大小
- python - 熊猫插值不使用某些方法进行插值
- java - MaxConnectionsPerHost 与 MaxRequestsPerConnection Cassandra 驱动程序
- javascript - `script` 和 `link as="script"` 标签之间的区别
- java - Postgres 更新查询在 pgAdmin 中工作,但在 Java 中失败
- c# - 在 C# 中压缩巨大的 csv 文件
- javascript - 更改或单击 mat-button-toggle 的事件