<template>
<view class="content">
<view @click="add">
{{username}} //这里值不会变化
</view>
</view>
</template>
<script>
import store from '@/store/index.js'
import { mapState } from 'vuex'
export default {
data() {
return {
}
},
computed: {
...mapState({
username: state => state.username,
})
},
methods: {
add(x){
store.commit('add')
}
}
}
</script>
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex); //vue的插件机制
//Vuex.Store 构造器选项
const store = new Vuex.Store({
state: { //存放状态
"username": "foo",
"age": 18
},
mutations: {
add(state) {
state.username ='change' //这里触发了，值也改变了
}
}
})
export default store
