mpvue + vuex,用mapMutations + mapGetters 实现简单的存与取
实现效果:在a页面存数据,通过a页面进入b页面时取数据首页,在store文件夹里创建4个js文件:state.jsconst state = {disc: {}}export default statemutations.jsconst mutations = {set_disc(state, disc) {state.disc = disc...
·
实现效果:在a页面存数据,通过a页面进入b页面时取数据
首页,在store文件夹里创建4个js文件:
state.js
const state = {
disc: {}
}
export default state
mutations.js
const mutations = {
set_disc(state, disc) {
state.disc = disc
}
}
export default mutations
getters.js
export const disc = state => state.disc
index.js
import Vue from 'vue'
import Vuex from 'vuex'
import state from './state'
import mutations from './mutations'
import * as getters from './getters'
Vue.use(Vuex)
export default new Vuex.Store({
state,
mutations,
getters
})
在a页面:import { mapMutations } from 'vuex' 。前提是已经安装了vuex。
将item存入set_disc
methods: {
selectItem(item) {
wx.navigateTo({
url: `/pages/disc/main?id=${item.id}`
})
this.setDisc(item)
},
...mapMutations({
setDisc: 'set_disc'
})
}
从a页面跳转到b页面后,在b页面取出数据
import { mapGetters } from 'vuex'
computed: {
...mapGetters([
'disc'
])
}
重要事情:
mpvue里不能直接通过this.$store拿到数据,所以需要在vue的原型上添加属性是$store的store对象
即在main.js中加上:Vue.prototype.$store = store
这部分详情请看我的另一篇博文:解决vuex辅助函数在mpvue中不能使用的问题
更多推荐
已为社区贡献13条内容
所有评论(0)