如何在vuex中直接赋值-创新互联
本篇文章为大家展示了如何在vuex中直接赋值,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。
在揭阳等地区,都构建了全面的区域性战略布局,加强发展的系统性、市场前瞻性、产品创新能力,以专注、极致的服务理念,为客户提供成都网站制作、成都做网站、外贸营销网站建设 网站设计制作按需设计,公司网站建设,企业网站建设,品牌网站设计,网络营销推广,外贸网站制作,揭阳网站建设费用合理。第一种方法 通过computed的计算属性直接赋值
1.store.js(vuex的代码如下):
import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) const state={//状态对象 num:1, } const mutations={//触发状态 jia(state){ state.num++; },//做加法 jian(state){ state.num--; },//做减法 } export default new Vuex.Store({ state, mutations, })
2.你自己组件a.vue代码如下:
{{msg}}
{{$store.state.num}}-{{num}}
注意:计算属性写法一定不要忘了给num()与上面的模板要同名
第二种方法 通过mapState的对象来赋值
这种方法更为简单
第一步 a.vue引入mapState
import {mapState} from 'vuex'
第二步将上面的计算属性改成下面这种写法即可
computed:mapState({num:state=>state.num}),即可
第三种方法通过mapState的数组来赋值
代码如下所示:
把上面的计算属性直接改成下面这种形式
computed:mapState(["num"])
注:记得加上import {mapState} from 'vuex'
上述内容就是如何在vuex中直接赋值,你们学到知识或技能了吗?如果还想学到更多技能或者丰富自己的知识储备,欢迎关注创新互联成都网站设计公司行业资讯频道。
另外有需要云服务器可以了解下创新互联scvps.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。
本文标题:如何在vuex中直接赋值-创新互联
转载注明:http://hbruida.cn/article/jcgdp.html