微信小程序 mixin & 全局store 方案
MIT License
| Demo | Update Log | Feedback bug/missing | Gitee
npm i mp-mixin
import'mp-mixin';
Click to download cdn file, copy it to your mini program project, and then import this file.
cdn address: [https://cdn.jsdelivr.net/npm/mp-mixin/mp-mixin.min.js](https://cdn.jsdelivr.net/npm/mp-mixin/mp-mixin.min .js)
Mixin is an object, the data structure is as follows
const store = wx.creteStore({});
const mixin = {
data: {}, // optional
methods: {}, // optional
store: store, // optional When injecting globally, store can be a json, otherwise it must be a store object
// The following is the unique life cycle or event of Page
// Please refer to the applet documentation for details
onLoad(){
},
onShareAppMessage(){
},
// The following is the unique life cycle or event of Component
lifetimes:{
// Please refer to the applet documentation for details
},
pageLifetimes:{
// Please refer to the applet documentation for details
}
}
WeChat Mini Program Page Document
WeChat Mini Program Component Document
Global mixin, recommended to be introduced in app.js
import'mp-mixin';
wx.mixin(mixin); // mixin object see 2.3.1
You can also introduce mixin as needed in the Page structure
Page({
mixin: mixin, // mixin object see 2.3.1
// ...
})
You can also introduce mixin as needed in the Component structure
Component({
mixin: mixin, // mixin object see 2.3.1
// ...
})
Description
After the introduction of mp-mixin, mp-mixin will mount the following three apis to the wx object
wx.mixin
wx.createStore
wx.initGlobalStore
wx.initGlobalStore
is equivalent to adding the store attribute to the wx.mixin
method
wx.initGlobalStore({
// state
})
wx.mixin({
store: {
// state
}
})
You can also actively introduce to use the above three APIs
import {globalMixin, createStore, initGlobalStore} from'mp-mixin'
// ...
You can manually inject into any object through the injectStaff
method
import {injectStaff} from'mp-mixin'
injectStaff(anyObject);
Get mp-mixin version
wx.mpMixinVersion
// or
import {version} from 'mp-mixin';