vuex的使用之mapGetters[通俗易懂]

vuex的使用之mapGetters[通俗易懂]vue项目中,经常会使用到vuex,vuex是vue的一个状态管理。本文简单总结一下:vuex中mapGetters的使用。如果一个变量或对象需要在多个页面和组件中使用,那么,可以使用mapGetters。一.vuex中声明变量个方法1.在state中声明:state:{freeShipping:cookie.get(‘freeShipping’),}2.在mutations中书写方法:mutations:{updatefreeShipping(state,fre

大家好,又见面了,我是你们的朋友全栈君。

vue项目中,经常会使用到vuex,vuex是vue的一个状态管理。

本文简单总结一下:vuex中mapGetters的使用。

如果一个变量或对象需要在多个页面和组件中使用,那么,可以使用mapGetters。

一.vuex中声明变量个方法

1.在state中声明:

state: {
   freeShipping:cookie.get('freeShipping'),
}

2.在mutations中书写方法:


mutations: {
    updatefreeShipping(state, freeShipping) {
            state.freeShipping =freeShipping;
        },
 }
 

3.在getters中书写:


getters: {
    freeShipping: state => state.freeShipping || {}
}
  

二.在各页面中使用

1,引入

   import { mapGetters  } from "vuex";

2,在method同级上放入computed

computed: mapGetters(["freeShipping"]),

或

computed: {
               ...mapGetters(["freeShipping"])
          } ,

可放入多个对象

  computed: mapGetters(["userInfo","freeShipping"]),

3,页面变量取用

{
  
  {freeShipping.value}}
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/144026.html原文链接:https://javaforall.net

赞 (1)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • responsebody作用ajax,@ResponseBody 用法

    responsebody作用ajax,@ResponseBody 用法返回数据ResponseBody注解的作用是将controller的方法返回的对象通过适当的转换器转换为指定的格式之后,写入到response对象的body区(响应体中),通常用来返回JSON数据。需要注意,在使用此注解之后不会再走视图处理器,而是直接将数据写入到输入流中,它的效果等同于通过response对象输出指定格式的数据。这也是我们通常的用法ajax的结束标识符最近我写一个购物车的业务…

    2022年5月27日
  • acwing-170. 加成序列(迭代加深)「建议收藏」

    acwing-170. 加成序列(迭代加深)「建议收藏」满足如下条件的序列 X(序列中元素被标号为 1、2、3…m)被称为“加成序列”:X[1]=1X[m]=nX[1]<X[2]<…<X[m−1]<X[m]对于每个 k(2≤k≤m)都存在两个整数 i 和 j (1≤i,j≤k−1,i 和 j 可相等),使得 X[k]=X[i]+X[j]。你的任务是:给定一个整数 n,找出符合上述条件的长度 m 最小的“加成序列”。如果有多个满足要求的答案,只需要找出任意一个可行解。输入格式输入包含多组测试用例。每组测试用例占据一行,包含

    2022年8月8日
  • Python的缩进规则「建议收藏」

    Python中的缩进(Indentation)决定了代码的作用域范围。这一点和传统的c/c++有很大的不同(传统的c/c++使用花括号花括号{}符决定作用域的范围;python使用缩进空格来表示作用域的范围,相同缩进行的代码是处于同一范围)。每行代码中开头的空格数(whitespace)用于计算该行代码的缩进级别(Indentationlevel),注意一个Tab会被替换为1~8个Space(具体的空格数量,不同的编译器有不同的数量),缩进级别为0表示无缩进空格。在一个源文件不建议同时使用空格和制表缩

    2022年4月10日
  • Pycharm远程连接服务器(windows下远程修改服务器代码)[通俗易懂]

    Pycharm远程连接服务器(windows下远程修改服务器代码)[通俗易懂]http://blog.csdn.net/duankaifei/article/details/418986411、写在前面  之前一致用putty,ssh,修改代码,或者本地修改,上传到服务器,各种不爽,现在改用xshell,但是有时候还是不方便感觉,于是自己配置了远程连接pycharm,这样不用总是到代码里修改,直接在windows下pycharm里修改再保存就可以实现同步更新

    2022年8月29日
  • oracle数据库sys密码修改_oracle修改system密码

    oracle数据库sys密码修改_oracle修改system密码Oracle提供两种验证方式,一种是OS验证,另一种密码文件验证方式,如果是第一种方式用以下方法修改密码:sqlplus/assysdbaalterusersysidentifiedby新密码;alterusersystemidentifiedby新密码;如果是第二种方法用以下方法修改密码:orapwdfile=pwdxxx.orapassword=你设定的新密码e…

    2022年7月28日
  • 以上都点赞表情包图片_超级点赞图片

    以上都点赞表情包图片_超级点赞图片原题链接微博上有个“点赞”功能,你可以为你喜欢的博文点个赞表示支持。每篇博文都有一些刻画其特性的标签,而你点赞的博文的类型,也间接刻画了你的特性。然而有这么一种人,他们会通过给自己看到的一切内容点赞来狂刷存在感,这种人就被称为“点赞狂魔”。他们点赞的标签非常分散,无法体现出明显的特性。本题就要求你写个程序,通过统计每个人点赞的不同标签的数量,找出前3名点赞狂魔。输入格式:输入在第一行给出一个正整数N(≤100),是待统计的用户数。随后N行,每行列出一位用户的点赞标签。格式为“Name K F​1​

    2022年8月8日

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号