微信小程序 实时更新(状态管理)类似vuex

准备：需要把微型框架放在根目录文件下链接如下
链接:https://pan.baidu.com/s/11B7Z2NaOsp7bGPXHMNOCOA 提取码: 4vup

在根目录文件下创建一个store文件里面放一个index.js文件

export default {
//类似于vue当中的state
  data: {
    num: 0 //共享的数据 只要一改变页面上就会刷新	
  }
}

定义好后在所需使用共享数据的路由的js文件下需要小小改动一下，如下图所示
先把store文件和create文件引入

import store from "../../store/index"
import create from "../../utils/create"

然后把Page内的对象剪切（内容太多此图片为选全）

剪切后为此图所示

然后把Page删除，然后如果时路由组件

如果是一般组件，create后跟Component在这里插入图片描述
以路由组件为例Page内传两个参数一个store为在store文件夹下index.js文件内定义的对象如下所示，另一个直接把之前剪切的Page内容粘贴上去

export default {
//类似于vue当中的state
  data: {
    num: 0 //共享的数据 只要一改变页面上就会刷新	
  }
}

使用共享数据

create.Page(store, {
  use: ['num'], //use为一个数组，内填字符串名字为在共享数据中定义的名字，可与data中名字相重合
  /**
   * 页面的初始数据
   */
  data: {

在wxm内使用

<!--此为使用data中的num  -->
<view>{{num}}</view>

<!--此为使用共享数据中的num  -->
<view>{{$.num}}</view>

在改变共享数据

this.store.data.num = 1