2

How does diffing props work for react natives virtual dom(whatever it is called, i.e. yoga)? What is the related source code for it? It might be similar to updateDomProperties(https://holmeshe.me/understanding-react-js-source-code-virtual-dom-diff-VIII/)

Especially, i try to understand react native WebView (https://github.com/react-native-community/react-native-webview) source property. Changing some fictive prop of source forces refreshing of webview for the same uri.

source={{uri:"http://...", forceReload:this.state.forceReload}}

How is this possible especially for Android?

I want to learn this to make sure that this behaviour does not change and break refreshing feature of my webview.

2
  • By diffing, do you mean how the React/React Native component detect changes in props and re-render? If that is the case, you can look up for React component's life cycle, and shallow comparison used in React.
    – blaz
    Feb 18, 2019 at 8:33
  • @blaz actually, i want to know how diffing props work in virtual dom or whatever they call it for react native.
    – subcoder
    Feb 18, 2019 at 8:55

1 Answer 1

3

Actually changing some fictive property on source causes virtual dom determine the change and call the setter of the source(setSource()) on the native webview.

But, native webview's setSource() checks uri and does not reload the url.

So, here is my way to refresh web view to initial url;

https://gist.github.com/expressiveco/d0063875ab15631199acc27abf633177

1
  • 1
    Yeah, I was also about to suggest to just have a button on the screen that allows the user to refresh the page or trigger it after an event/some time. Feb 19, 2019 at 9:15

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.