现在日常开发中,小程序的开发框架有很多,uniapp,taro,mpvue等,都自带了状态库,而偏偏 写原生小程序就没有自带的状态库, 原生既方便又其他同事容易上手;所以自己写了一个库,一个文件即可~
直接上gitee 源码: https://gitee.com/Rick_0/applet-state-library
如何使用?
下载 store-core.js 文件,
store.js
import { createStore } from './store-core';
export const store = new createStore({
state: { // 这里是仓库值
author:'rick',
arr:[]
},
dev:false,//打开会有自动 错误提示
global:false, //是否开启自动全局注入state, 开启全局后页面多了会影响性能,二十个页面内性能正常
mutations: {// 这里参考vuex
changeAuthor(state){
state.author = 'nancy';
},
s(state,val){
state.arr = val
}
}
})
app.js
// 2. 在app.js 中引入 store.js
import { store } from './store'
App({
store,
data: {}
})
在页面中
要声明useStore 两种方式
page({
useStore:true, // 全部注入
useStore:[ "变量名" ] // 按需引入 建议!!
})
this.$store.变量名
<view>{{ $store.变量名 }}</view>
如何修改状态?
在页面 获取 app实例, app.store.$commit
方法一: getApp().store.$commit(" mutation方法 ", 值) =>>类似vueX
方法二: getApp().store.$commit( { 变量: 值 } ) =>>类似小程序setData
网友评论