微客导航 » 文章资讯 » 浅谈vuex的基本用法和mapaction传值问题

浅谈vuex的基本用法和mapaction传值问题

2023-08-09 16:30:04 318

vuex的理论知识就不多提了，官网上已经有明确的讲解。

用一个简单的例子来描述一下基本的用法:

第一步：npminstallvuex–save-dev

第二步：在目录中创建store目录配置管理状态

//store/index.js
/**
*Createdbyzhaohuanon2017/7/13.
*/
importVuefrom'vue'
importVuexfrom'vuex';


Vue.use(Vuex);

conststore=newVuex.Store({
state:{
msg:'原始数据'
},
actions:{
fun:function({commit},date){
commit('saveAdminInfo',{list:date});
},
},
mutations:{
saveAdminInfo(state,adminInfo){
state.msg=adminInfo.list;
}
}
});


exportdefaultstore;

第三步：在main.js中引入store

newVue({

el:'#app',
router,
store,
template:'',
components:{App}
});

第四部：编写路由页面

//test1.vue

test2.vue

修改之前：

test1

test2

以上这篇浅谈vuex的基本用法和mapaction传值问题就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持毛票票。

声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。

返回顶部
3162201930
czq8825@qq.com

浅谈vuex的基本用法和mapaction传值问题

热门推荐

随机推荐