react native 项目该如何引入mobx

Question

脚手架初始化了一个项目react native 项目,不知道在哪加了

App.js:

import { StatusBar } from 'expo-status-bar';
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';

export default function App() {
  return (
    <View style={styles.container}>
      <Text>Open up App.js to start working on your app!</Text>
      <StatusBar style="auto" />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

index.js

import { registerRootComponent } from 'expo';

import App from './App';

// registerRootComponent calls AppRegistry.registerComponent('main', () => App);
// It also ensures that whether you load the app in the Expo client or in a native build,
// the environment is set up appropriately
registerRootComponent(App);

Answer 1

像在React中使用一样的。
Mobx中文文档 。文档就是以Mobx + React 为例写的。
App.js:

/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 *
 * @format
 * @flow
 */

import React, {Component} from 'react'
//...
import {Provider} from 'mobx-react'
import store from './src/mobx/store'

export default class App extends Component {

  render() {
    return (
      <Provider store={store}>
        <Navigation/>
      </Provider>
    )
  }
}

业务组件：

import { inject, observer } from 'mobx-react'
//...
@observer
class Index extends Component {

  //...
    return (
      //...
    )
  }
}
export default inject('store')(Index)