現(xiàn)在日常開發(fā)中,小程序的開發(fā)框架有很多,uniapp,taro,mpvue等,都自帶了狀態(tài)庫,而偏偏 寫原生小程序就沒有自帶的狀態(tài)庫, 原生既方便又其他同事容易上手;所以自己寫了一個庫,一個文件即可~
直接上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, 開啟全局后頁面多了會影響性能,二十個頁面內(nèi)性能正常
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>
如何修改狀態(tài)?
在頁面 獲取 app實例, app.store.$commit
方法一: getApp().store.$commit(" mutation方法 ", 值) =>>類似vueX
方法二: getApp().store.$commit( { 變量: 值 } ) =>>類似小程序setData
