1. 安装Mobx相关包

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

2. 构建npm

删除miniprogram_npm文件夹
重新构建npm

3. 创建store实例对象

根目录下创建store文件夹，新建store.js文件用于创建Store实例对象

// 创建Store实例对象
import {observable} from 'mobx-miniprogram'
export const store= observable({
  //共享数据
  num1:1,
  num2:2
})

4. 定义计算属性

方法名前加get ，只可获取，不能修改

//计算属性
  get sum(){
    return this.num1+this.num2
  }

4. 定义Actions方法可以修改数据

import {observable,action} from 'mobx-miniprogram'

//actions
  updateNum1:action(function(step){
    this.num1+=step
  }),
  updateNum2:action(function(step){
    this.num2+=step
  })

5. 将Store成员绑定到页面中

页面js中

import {createStoreBindings} from 'mobx-miniprogram-bindings'
import {store} from '../../store/store'

onLoad函数

this.storeBindings=createStoreBindings(this,{
    store,
    fields:['num1','num2','sum'],
    actions:['updateNum1']
})
onUnload:function(){
    this.storeBindings.destoryStoreBings()
}

6. 页面中使用Store

wxml

<view>{{num1}}+{{num2}}={{sum}}</view>
<button bindtap="btn1" data-step="{{1}}">+1</button>
<button bindtap="btn1" data-step="{{-1}}">-1</button>

js

btn1(e){
    this.updateNum1(e.target.dataset.step)
}

7. 绑定到组件中

import {storeBindingsBehavior} from 'mobx-miniprogram-bindings'
import {store} from '../../store/store'
Component({
    behaviors:[storeBindingsBehavior],
    storeBindings:{
        store,
        fields:{
            num1:()=>store.num1,
            num2:()=>store.num2,
            sum:'sum'
        },
        actios:{
            updateNum2:'updateNum2'
          }
      }
})

组件中使用和页面一样