vuex中getter是什么意思,vue getter

  vuex中getter是什么意思,vue getter

  本文主要介绍Vuex中Getter的基本使用教程,相当于Vuex中的计算属性处理状态然后返回。本文通过示例代码非常详细地介绍了getter,有需要的人可以参考一下。

  

前言

  Vuex允许我们在商店中定义“getter”(可以认为是商店的计算属性)。就像计算属性一样,getter的返回值会根据其依赖关系进行缓存,只有当其依赖关系值发生变化时才会重新计算。

  以官网为例来说明,官网代码如下:

  使用以下代码访问组件中的:

  这个。$ store . getters . donetodoccount

  

一、说明

  默认情况下,getters中的访问器函数将传递两个参数(state、getters)。第一个参数state可以访问数据,getters参数可以访问访问器中的其他访问器函数。在大多数情况下,只需要第一个参数,并且可以只编写第一个参数来定义访问器函数,如上例所示。访问这些访问器属性时,就像是组件中的计算属性一样调用,而不是像函数调用一样。

  这是有第二个参数getters时的使用示例。下面的代码调用直接用于组件就像调用计算属性一样。第2个参数系统会默认传递。

  这个。$store.getters.doneTodos

  

二、getter返回一个函数

  通过让getter返回一个函数来传递参数给getter。因此它的主要作用是传递参数。

  当这个。在组件中直接访问store . getters . gettoboyid,则返回一个函数。然后,调用函数传入参数,并获得函数的结果。

  

三、使用mapGetters对象展开

  在组件的计算属性中,可以直接使用以下方法,这样可以方便地引用getter属性,然后就可以像普通的计算属性一样使用了。

  如果要为getter属性取另一个名称,请使用对象形式:

  这些知识点有时候光靠看文档是很难理解的。如果你手动练习,就很容易消化和理解。

  

vuex getter传参方法

  getters: {

  getProductByid:(state)=(id)=1

  {

  return state . product list . find(item=item . id===id);

  }

  }

  使用命名空间时调用:

  这个。$ store . getters[ your namespace/getProductByid ](id);

  不使用名称空间调用:

  这个。$ store . getters . getproductbyid(id);

  

总结

  关于vuex中Getter用法的这篇文章就到这里了。有关Vuex Getter用法的更多信息,请搜索我们以前的文章或继续浏览下面的相关文章。希望你以后能支持我们!

郑重声明:本文由网友发布,不代表盛行IT的观点,版权归原作者所有,仅为传播更多信息之目的,如有侵权请联系,我们将第一时间修改或删除,多谢。

留言与评论(共有 条评论)
   
验证码: