在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/網(wǎng)絡(luò)安全  HTML/ mobx多個(gè)store問題

mobx多個(gè)store問題

我在react中使用mobx做狀態(tài)管理實(shí)現(xiàn)了簡單計(jì)數(shù)器demo,如果該頁面今后需要添加新的功能,我希望不同功能存放在不同的store,請問這要如何實(shí)現(xiàn)

countStore.js

import { observable,action, computed } from 'mobx';
class CountStore{
    @observable num = 0;
    @computed get displayResult(){
        return this.num;
    }
}

export default CountStore;

app.js

import React, { Component } from 'react';
import { render } from 'react-dom';
import Count from './count';
import Display from './display';
import CountStore from "../store/countStore";
const CountStores = new CountStore();
class Countapp extends Component{
    constructor(props){
        super(props)
    }

    render(){
        return <div>
            
            <Count store={CountStores}/>
            <Display store={CountStores}/>
            
        </div>
    }
}

export default Countapp;
回答
編輯回答
離殤

Mobx類似于Redux,也是有Provider方法,可以把Store掛載到整個(gè)應(yīng)用上,至于多個(gè)Store實(shí)現(xiàn)起來也是簡單的,給個(gè)例子:

storeA.js

import {observable, action} from 'mobx';

class AStore {
  //……
}

const aStore = new AStore()

export {aStore}

storeB.js

import {observable, action} from 'mobx';

class BStore {
  //……
}

const bStore = new BStore()

export {bStore}

index.js

import {bStore} from './storeA'
import {bStore} from './storeB'

export {bStore, bStore}

具體可以看看我的項(xiàng)目>>react-mobx-demo

順便再給個(gè)Redux的項(xiàng)目>>react-redux-demo

2017年9月23日 11:53
編輯回答
兔寶寶

再寫一個(gè)store.js文件就可以了

2018年2月8日 05:09