search

ascoders / react-native-image-viewer

🚀 tiny & fast lib for react native image viewer pan and zoom
MIT License
2.44k stars 578 forks source link

Update deprecated lifecycle methods #358

Closed ArtemKolichenkov closed 4 years ago

ArtemKolichenkov commented 4 years ago

Closes #350 This PR replaces soon to be deprecated React lifecycle methods with modern counterparts.

componentWillMount

straightforward fix, just replaced with componentDidMount

componentWillReceiveProps

This one is a bit tricky. The big difference between componentWillReceiveProps (WRP) and getDerivedStateFromProps (DSFP) is that WRP is invoked ONLY when props change and DSFP invokes before every render, no matter if it is caused by props or state change. To replicate WRP with DSFP there are two solutions: 1) mirror the last prop into state 2) invoke setState() in componentDidUpdate

Option number 2 would cause a re-render, so I decided to use option 1. This is actually recommended way by Dans Abramov and React core team (React's docs Updating state based on props goes into a bit of details about why the decision was made.)

Yes. Our recommendation is to put such values on the state (like state.prevRow in the blog post example). This frees up React to not hold into the whole previous props object in some cases in future versions.

It’s a bit more verbose but it also solves the problem of prevProps being null on first render (and thus forcing you to write an extra check every time you use this method).

Couple of other guides (SO Answer, Another guide) also suggest the same solution.

People are a bit pissed about it since it forces mirroring of prop inside the state but after couple of hours of research it seems that there is no easier way for it other than setState in componentDidUpdate but it will affect performance due to extra re-render cycle.

ArtemKolichenkov commented 4 years ago

Also it would be great to merge #356 before this one since now expo is kinda broken... just for the sake of other developers :)

ascoders commented 4 years ago

Good job @ArtemKolichenkov !

Egizas commented 4 years ago

@ascoders can we please get a release?

joerez commented 4 years ago

@ascoders Could this be released?

myckhel commented 4 years ago

after updating to version 2.2.27 i still got the deprecated lifecycle warning.

eddietex commented 4 years ago

@ascoders we appreciate the creation of this package. That said, do you still mean to maintain it? And by maintain it, I mean, accept PRs from the community. I see that this PR was merged a while ago but still not released, and it seems like some of us are awaiting on this release, which can only be done by yourself.

Thanks in advance for your time and attention :)

ascoders commented 4 years ago

Sorry for late reply, due to the large changes, major version upgrade is adopted to prevent the break change. react-native-image-zoom-viewer@3.0.0 is now released!

By the way, anyone want to be a backup maintainer?

ArtemKolichenkov commented 4 years ago

@ascoders I can become backup maintainer. Actually have some free time on my hands right now due to COVID-19 so wouldn't mind going through issues and fix some stuff. :)

ascoders commented 4 years ago

Thank you for your help @ArtemKolichenkov, welcome to be a contributor! Below is the invitation link:

react-native-image-viewer, react-native-image-zoom