使用mobx 創建前端store並使用

話不多說直接上代碼
1.使用mobx需要下載mobx和mobx-react兩個依賴包

 

2.寫一個store的類文件比如：

      import { observable, action } from 'mobx'

      class Mobx1 {

              @observable number;

               constructor() {

                     this.number = 0

                 }

              @action

               addNumber = (number) => {

                    this.number = number

               }

       }

      const MyMobx = new Mobx1();

      export { MyMobx };

3. 新建總的store文件，將store的類文件注入到總的store文件中
 

    import { MyMobx } from './mobx'

    const store = {

            MyMobx

     }

    export default store

 

4. 將總的store文件注入到路由的外層，也是頁面的外層

 

 

 

 

 5. 在使用頁面中需要先用inject注入使用的store類，在使用this.props下的這個store類的方法及屬性

 

 

然后就能愉快的使用了哈哈