钟表 东莞网站建设,商城站地址,网站开发合同中英文,wordpress 进销存主题查看小程序根目录中是否存在package.json文件
在项目根目录运行cmd
没有package.json文件输入npm init -y初始化一下,初始化一个包管理
安装MobX
npm install --save mobx-miniprogram4.13.2 mobx-miniprogram-bindings1.2.1
小程序菜单栏工具–构建npm
根目录创建store文…查看小程序根目录中是否存在package.json文件
在项目根目录运行cmd
没有package.json文件输入npm init -y初始化一下,初始化一个包管理
安装MobX
npm install --save mobx-miniprogram4.13.2 mobx-miniprogram-bindings1.2.1
小程序菜单栏工具–构建npm
根目录创建store文件夹,在文件夹下新建store.js ,这个文件是专门用来创建store的实例对象
import {observable} from mobx-miniprogram
export const store observable({userid: 123,username: as,numA: 1,numB: 2,// 计算属性get sum() {return this.numA this.numB},// action方法,用来修改store中数据UpdateNum1: action(function (step) {this.numA step}),UpdateNum2: action(function (step) {this.numB step})
})在页面使用store数据
.js文件
import {createStoreBindings} from mobx-miniprogram-bindings
import {store} from ../../store/store
//在onload生命周期中挂载onLoad: function (options) {this.storeBindings createStoreBindings(this, {store,// 数据以及计算属性放fields里fields: [numA, numB, userid, username, sum],actions: [UpdateNum1, UpdateNum2]})},//在onUnload中清理onUnload: function () {// 数据清理this.storeBindings.destroyStoreBindings()},此时可以在页面中用{{}}使用store中的数据
viewuserid{{userid}}/view
viewusername{{username}}/view使用store中的action方法
页面绑定一个方法,并且使用data-*进行传参
view{{numA}}{{numB}}{{sum}}/view
van-button bindtapchange data-newA{{1}}numA1/van-button
van-button bindtapchange typewarning data-newA{{-1}}numA-1/van-button在js中使用 change(e) {console.log(e);const newA e.currentTarget.dataset.newathis.UpdateNum1(newA)},打印 点击之后就可以是页面数据1或者-1
