Skip to content

Depreciation Warning 'componentWillReceiveProps' #206

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
gmpmovies opened this issue Nov 22, 2020 · 5 comments · Fixed by #216
Closed

Depreciation Warning 'componentWillReceiveProps' #206

gmpmovies opened this issue Nov 22, 2020 · 5 comments · Fixed by #216

Comments

@gmpmovies
Copy link

I'm getting the deprecation warning 'componentWillReceiveProps' when running this component, is this something I need to worry about?

@gmpmovies
Copy link
Author

gmpmovies commented Nov 23, 2020

Warning: Failed prop type: Invalid prop `decelerationRate` of value `normal` supplied to `SortableList`, expected one of [null,null].
- node_modules/react-native/Libraries/LogBox/LogBox.js:173:8 in registerError
- node_modules/react-native/Libraries/LogBox/LogBox.js:59:8 in errorImpl
- node_modules/react-native/Libraries/LogBox/LogBox.js:33:4 in console.error
- node_modules/expo/build/environment/react-native-logs.fx.js:27:4 in error
- node_modules/prop-types/checkPropTypes.js:20:6 in printWarning
- node_modules/prop-types/checkPropTypes.js:82:22 in checkPropTypes
- node_modules/react/cjs/react.development.js:1714:20 in validatePropTypes
- node_modules/react/cjs/react.development.js:1813:21 in createElementWithValidation
* src/screens/ToolScreen.js:75:12 in ToolScreen
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:10073:26 in renderWithHooks
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:12882:27 in mountIndeterminateComponent
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:19181:22 in beginWork$1
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:18085:22 in performUnitOfWork
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:18013:38 in workLoopSync
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:17977:18 in renderRootSync
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:17674:33 in performSyncWorkOnRoot
* [native code]:null in performSyncWorkOnRoot
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5321:31 in runWithPriority$argument_1
- node_modules/scheduler/cjs/scheduler.development.js:653:23 in unstable_runWithPriority
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5316:21 in flushSyncCallbackQueueImpl
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5304:28 in flushSyncCallbackQueue
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:17718:28 in batchedUpdates$1
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:2492:29 in batchedUpdates
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:2638:16 in _receiveRootNodeIDEvent
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:2767:27 in receiveTouches
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:416:4 in __callFunction
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:109:6 in __guard$argument_0
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:364:10 in __guard
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:108:4 in callFunctionReturnFlushedQueue
* [native code]:null in callFunctionReturnFlushedQueue

Warning: componentWillMount has been renamed, and is not recommended for use. See https://fb.me/react-unsafe-component-lifecycles for details.

* Move code with side effects to componentDidMount, and set initial state in the constructor.
* Rename componentWillMount to UNSAFE_componentWillMount 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: %s, SortableList
- node_modules/react-native/Libraries/LogBox/LogBox.js:117:10 in registerWarning
- node_modules/react-native/Libraries/LogBox/LogBox.js:63:8 in warnImpl
- node_modules/react-native/Libraries/LogBox/LogBox.js:36:4 in console.warn
- node_modules/expo/build/environment/react-native-logs.fx.js:18:4 in warn
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:106:4 in printWarning
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:60:16 in warn
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5846:10 in ReactStrictModeWarnings.flushPendingUnsafeLifecycleWarnings
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:19093:6 in flushRenderPhaseStrictModeWarningsInDEV
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:18335:41 in commitRootImpl
* [native code]:null in commitRootImpl
- node_modules/scheduler/cjs/scheduler.development.js:653:23 in unstable_runWithPriority
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:18317:17 in commitRoot
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:17697:12 in performSyncWorkOnRoot
* [native code]:null in performSyncWorkOnRoot
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5321:31 in runWithPriority$argument_1
- node_modules/scheduler/cjs/scheduler.development.js:653:23 in unstable_runWithPriority
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5316:21 in flushSyncCallbackQueueImpl
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5304:28 in flushSyncCallbackQueue
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:17718:28 in batchedUpdates$1
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:2492:29 in batchedUpdates
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:2638:16 in _receiveRootNodeIDEvent
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:2767:27 in receiveTouches
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:416:4 in __callFunction
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:109:6 in __guard$argument_0
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:364:10 in __guard
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:108:4 in callFunctionReturnFlushedQueue
* [native code]:null in callFunctionReturnFlushedQueue

@gmpmovies
Copy link
Author

Warning: componentWillReceiveProps has been renamed, and is not recommended for use. See https://fb.me/react-unsafe-component-lifecycles 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: https://fb.me/react-derived-state
* 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: %s, Row, SortableList
- node_modules/react-native/Libraries/LogBox/LogBox.js:117:10 in registerWarning
- node_modules/react-native/Libraries/LogBox/LogBox.js:63:8 in warnImpl
- node_modules/react-native/Libraries/LogBox/LogBox.js:36:4 in console.warn
- node_modules/expo/build/environment/react-native-logs.fx.js:18:4 in warn
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:106:4 in printWarning
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:60:16 in warn
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5864:10 in ReactStrictModeWarnings.flushPendingUnsafeLifecycleWarnings
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:19093:6 in flushRenderPhaseStrictModeWarningsInDEV
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:18335:41 in commitRootImpl
* [native code]:null in commitRootImpl
- node_modules/scheduler/cjs/scheduler.development.js:653:23 in unstable_runWithPriority
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:18317:17 in commitRoot
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:17697:12 in performSyncWorkOnRoot
* [native code]:null in performSyncWorkOnRoot
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5321:31 in runWithPriority$argument_1
- node_modules/scheduler/cjs/scheduler.development.js:653:23 in unstable_runWithPriority
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5316:21 in flushSyncCallbackQueueImpl
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5304:28 in flushSyncCallbackQueue
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:17718:28 in batchedUpdates$1
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:2492:29 in batchedUpdates
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:2638:16 in _receiveRootNodeIDEvent
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:2767:27 in receiveTouches
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:416:4 in __callFunction
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:109:6 in __guard$argument_0
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:364:10 in __guard
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:108:4 in callFunctionReturnFlushedQueue
* [native code]:null in callFunctionReturnFlushedQueue

@amarqueslee
Copy link
Contributor

I saw this today as well, and was concerned about it too.

However I think the community is already looking to address this in: #167

@amarqueslee
Copy link
Contributor

Oh, and see my patch for that first warning you reported : #209 .

Basically there's a line that I changed from oneOf to oneOfType to fix that.

@csaq5507
Copy link

csaq5507 commented Jan 4, 2021

I created a patch with the changes of https://github.com/BrownUniversity/react-native-sortable-list

  1. install patch-package.
  2. create a folder in your project called "patches"
  3. Inside "patches" folder get the patch from this gist (for convenience) https://gist.github.com/csaq5507/53353ba37b68732a1d14b63133fecdc5
    and name it as react-native-sortable-list+0.0.24.patch
  4. yarn install or npm install

Should fix that.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants