npm install --save mobx-miniprogram@4.13.2 mobx-miniprogram-bindings@1.2.1

// 創(chuàng)建store文件夾下的store.js文件，在這個 JS 文件中，專門來創(chuàng)建 Store 的實例對象
import {observable,action} from 'mobx-miniprogram'
 
export const store = observable({
  // 數據字段
  numA:1,
  numB:2,
  // 計算屬性
  get sum(){
    return this.numA + this.numB
  },
  // actions 函數，專門來修改 store 中數據的值
  updateNum1:action(function(step){
    this.numA += step
  }),
  updateNum2:action(function(step){
    this.numB += step
  }),
})

// 路徑需要相對路徑，不然會報錯
import {createStoreBindings} from '../../miniprogram/miniprogram_npm/mobx-miniprogram-bindings/index'
import {store} from '../../store/store'
Page({
  //生命周期函數--監(jiān)聽頁面加載
  onLoad(options) {
    this.storeBindings = createStoreBindings(this,{
      store,
      fields:['numA','numB','sum'],
      actions:['updateNum1']
    })
  },
  //生命周期函數--監(jiān)聽頁面卸載
  onUnload() {
    this.storeBindings.detroyStoreBindings()
  },
})

// .wxml文件
<view>{{numA}}+{{numB}}={{sum}}</view>
<van-button type="primary" bindtap="btnHander1" data-step="{{1}}">numA+1</van-button>
<van-button type="danger" bindtap="btnHander1" data-step="{{-1}}">numB-1</van-button>
// .js文件
// pages/message/message.js
import {createStoreBindings} from '../../miniprogram/miniprogram_npm/mobx-miniprogram-bindings/index'
import {store} from '../../store/store'
 
Page({
  //生命周期函數--監(jiān)聽頁面加載
  onLoad(options) {
    this.storeBindings = createStoreBindings(this,{
      store,
      fields:['numA','numB','sum'],
      actions:['updateNum1']
    })
  },
  //綁定按鈕點擊事件
  btnHander1(e){
    // console.log(e);
    this.updateNum1(e.target.dataset.step)
  },
  //生命周期函數--監(jiān)聽頁面卸載
  onUnload() {
    this.storeBindings.detroyStoreBindings()
  },
})

import {storeBindingsBehavior} from '../../miniprogram/miniprogram_npm/mobx-miniprogram-bindings/index'
import {store} from '../../store/store'
 
Page({
  behaviors:[storeBindingsBehavior],
  storeBindings:{
    // 數據源
    store, //指定要綁定的store
    fields:{//指定要綁定的字段數據
      numA:()=>store.numA,     //綁定字段的第一種方式
      numB:(store)=>store.numB,//綁定字段的第二種方式
      sum:'sum',               //綁定字段的第三種方式
    },
    actions:{ //指定要綁定的方法
      updateNum2:'updateNum2'
    }
  },
})

//組件的 .wxml結構
<view>{{numA}}+{{numB}}={{sum}}</view>
<van-button type="primary" bindtap="btnHander2" data-step="{{1}}">numB+1</van-button>
<van-button type="danger" bindtap="btnHander2" data-step="{{-1}}">numB-1</van-button>
 
//組件的 .js結構
methods: {
  btnHander2(e){
    this.updateNum2(e.target.dataset.step)
  }
}

{
  "pages":[ //主包的所有界面
    "pages/home/home",
    "pages/message/message",
    "pages/contact/contact",
    "pages/index/index",
    "pages/logs/logs"
  ],
  "subpackages":[ //通過subpackages節(jié)點，聲明分包的結構
    {
      "root": "package", //第一個分包的根目錄
      "name": "p1"http://給分包起個別名用來區(qū)分分包
      "pages": [//當前分包下，所有頁面的相對存放路徑
        "pages/demoA/demoA",
        "pages/demoB/demoB"
      ]
    },
    {
      "root": "package2", //第二個分包的根目錄
      "name": "p2"http://給分包起個別名用來區(qū)分分包
      "pages": [//當前分包下，所有頁面的相對存放路徑
        "pages/demoC/demoC",
        "pages/demoD/demoD"
      ]
    }
  ],
}

"subpackages":[ 
  {
    "root": "package", 
    "pages": [
      "pages/demoA/demoA",
      "pages/demoB/demoB"
    ],
    "independent": true //通過此節(jié)點，聲明當前“package”分包為“獨立分包”
  }
],

{
  "preloadRule":{ //分包預下載規(guī)則
      "pages/contact/contact":{ //觸發(fā)分包預下載的頁面路徑
        //network 表示在指定的網絡模式下進行預下載
        //可選值為：all（不限網絡）或wifi（僅 wifi 模式下進行預下載）
        //默認值為：wifi
        "network": "all"
        //packages 表示進入頁面之后，預下載哪些分包
        //可以通過 root 或 name 指定預下載哪些分包
        "packages": ["package"],
       }
  }
}