//store.ts
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex);
const task = {
state: {
taskPerson: localStorage.taskPerson||[]
},
getters:{
taskPerson: (state: any) => state.task.taskPerson
},
mutations: {
SET_TASKPERSON:(state: any, taskPerson: any) => {
state.taskPerson = taskPerson;
localStorage.taskPerson = JSON.stringify(taskPerson)
}
},
actions: {
settaskperson({commit}: any,taskPerson: any){
commit('SET_TASKPERSON', taskPerson);
}
}
};
const store = new Vuex.Store({
modules: {
task
}
});
export default store ;
//main.ts中
import store from './store';
new Vue({
store,
render: (h: any) => h(App)
}).$mount('#app');
//task.vue
<template>
<div>
<span>{{getTaskPerson}}</span>
<button @click="fn"></button>
</div>
</template>
<script>
export default {
computed:{
getTaskPerson(){
return this.$store.getters.taskPerson
}
},
methods:{
fn(){
let a = Math.random()*10
this.$store.dispatch("settaskperson"，a)
}
}
}
</script>
