vuex直接赋值的三种方法总结
发布时间:2020-12-16 23:33:21 所属栏目:百科 来源:网络整理
导读:我们在编写vuex代码过程中,觉得在a.vue的模板里面写入例如 {{$store.state.num}} 很麻烦,我们希望直接就写成{{num}},我们应该怎么写,vue给出三种固定写法,大家理解之后基本照抄,稍做改动即可 第一种方法 通过computed的计算属性直接赋值 1.store.js(vue
我们在编写vuex代码过程中,觉得在a.vue的模板里面写入例如 {{$store.state.num}} 很麻烦,我们希望直接就写成{{num}},我们应该怎么写,vue给出三种固定写法,大家理解之后基本照抄,稍做改动即可第一种方法 通过computed的计算属性直接赋值1.store.js(vuex的代码如下):}
export default new Vuex.Store({ state,mutations,}) 2.你自己组件a.vue代码如下:{{msg}}{{$store.state.num}}-{{num}}注意:计算属性写法一定不要忘了给num()与上面的模板要同名 第二种方法 通过mapState的对象来赋值这种方法更为简单 第一步 a.vue引入mapState 第二步将上面的计算属性改成下面这种写法即可 computed:mapState({num:state=>state.num}),即可 第三种方法通过mapState的数组来赋值代码如下所示: 把上面的计算属性直接改成下面这种形式 注:记得加上import {mapState} from 'vuex' 以上这篇vuex直接赋值的三种方法总结就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持编程之家。 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |