Question

我无法理解Provider包中@inject和mobx-react/native的角色。

使用mobx Provider的大多数示例都使用它来提供全局存储。像这样：

import { Provider as MobXProvider, observer } from 'mobx-react/native';
import myStore from './stores/myStore.js'

@observer
export default class App extends Component{
    render() {
      return(
      <MobXProvider store={myStore)>
        <NavigationStackOrSomethingElse />
      </MobXBrovider>)
    }
}

Provider到底是什么意思？据我了解，我需要将@inject商店添加到后续视图的props中。有没有办法在单个控制器中提供和使用商店？像这样：

import { Provider as MobXProvider, observer } from 'mobx-react/native';
import myStore from './stores/myStore.js'

@inject('store')  // <-- doesn't work
@observer
export default class SomeSmallView extends Component{
  render() {
    return(
    <MobXProvider store={myStore)>
      <MyViewThings />
    </MobXBrovider>)
  }
  myAction() {
    this.props.state.doSomeStateThings();
  }

}

如果使用多个商店，供应商如何使用？它们都在Root屏幕中提供了吗？它们是由想要使用它的组件的父屏幕提供的吗？

Answer 1

所以事实证明，你总是在开头提供你想要在你的应用中使用的所有商店：

<Provider chatStore={chatStore} wallStore={wallStore}>
  ...
</Provider>

然后只需使用@inject将它们注入使用它们的组件中。

将MobXProvider（Provider）放在具有多个商店的React Native应用程序中的位置

1 个答案: