这里直接上demo

在 demo.vue中
...
{{listData.name}}
...
...
export default{
...
computed:{
listDatas(){
listDatas(){ return this.$store.state.listDatas; }
}
},
methods:{
toStore(listDatas){
this.$store.dispatch('TOSTORE',{listDatas:listDatas});//这里是分发到actions里面，注意参数传递
}//这里的$store要先挂载到入口main.js
},
created(){
   this.$http.get('/api/list').then((response)=>{
     response=response.body;
      let listDatas=response.data.listData;
     this.toStore(listDatas);
    })
  }
...
}
...
//在actions.js文件中
export const TOSTORE =({commit,state},obj)=>{//注意参数的传递
  commit('TOSTORE',{obj});
}
//在store.js中
...
const mutations = {
["TOSTORE"](state,{obj}){
state.listDatas=obj.listDatas;
}
}
...
<------------------------divide line---------------------------------->
因为时间的问题，这里不展开代码来具体讲解
在后期会进行一个详细的vuex的各个文件的讲解
。，。
周一愉快
# vue.js # javascript # 前端
Logo
Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^

avatar Vue
cover

echarts堆叠柱状图

avatar Vue

Error in v-on handler: "TypeError: Cannot read properties of undefined (reading 'current')"

这是一个 Vue.js 错误，报错信息提示在 v-on 处理程序中出现了错误：“TypeError: Cannot read properties of undefined(读取 'current')”。这意味示在您的代码中，试图读取一个未定义的变量 'current'。您需要检查您的代码，确保 'current' 已正确定义并初始化。...

avatar Vue