这是React中的小菜一碟.如果您希望MobX存储在任何React组件中都可用,则只需使用mobx-react @inject组件即可.就像是:
import React from 'react';
import {inject} from 'mobx-react';
@inject('myStore')
class Dummy extends React.Component {
然后,我的商店可用作道具:
this.props.myStore.myMethod();
不错,方便…而且仅限React.也许我缺少了一些东西,但是我找不到从普通ES6类访问我的商店的方法.在纯Vanilla Javascript中的普通ES6类中,如何获得相同的结果?
解决方法:
在MobX GitHub帐户中由adonis-work找到的答案.给出答案:
将商店导出为单例:
// Store.js
import { observable, computed } from 'mobx'
class Store {
@observable numClicks = 0
@computed get oddOrEven() {
return this.numClicks % 2 === 0 ? 'even' : 'odd'
}
}
const store = new Store()
export default store
…使我们能够多次在应用程序中的任何位置导入和使用活动存储.
// Component.jsx
import store from Store
// use the global store in any component without passing it
// down through the chain of props from the root node
store.numClicks = 4
console.log(store.oddOrEven)
我使用这种方法已经有一段时间了.有什么需要注意的警告吗?
链接到源:https://github.com/mobxjs/mobx/issues/605