1

How does the following import make a difference?

import { observer } from 'mobx-react/native'

instead of

import { observer } from 'mobx-react'

Additional Information

  • React Native version: ~0.48.4
  • React: 16.0.0
  • mobx-formatters: 1.0.2,
  • mobx-logger: 0.6.0,
  • mobx: 3.3.1,
  • mobx-persist: 0.3.4,
  • mobx-react: 4.3.3

Comment If any more information required

Pavan Gangireddy
  • 417
  • 1
  • 3
  • 13

1 Answers1

2

Mobx-React uses a function called unstable_batchedUpdates. This dependency comes from react-dom (browser) or react-native (mobile). On your mobile device you have no dom so you can not use react-dom. So when you import 'mobx-react/native' it uses the function from the react-native package.

See here:

https://github.com/mobxjs/mobx-react/blob/0e1cdc83bfb7e45a43aa9b8f23498d3c95943433/src/index.js

You can also see in mobx-react in your nodes modules folder, that the index.js (resolved when importing from 'mobx-react') gets the ReactDom as a dependency:

}(this, (function (exports,mobx,React,ReactDOM) { 'use strict';

While on the other hand importing from 'mobx-react/native', it gets reactNative as a dependency instead of the ReactDom:

}(this, (function (exports,mobx,React,reactNative) { 'use strict';

If you want to learn more about react batching updates read here:

Daniel
  • 1,933
  • 12
  • 17