如何为vuex实现带参数的 getter和state.commit

getter 带参数

参考： https://vuex.vuejs.org/guide/getters.html#method-style-access

或者： https://stackoverflow.com/questions/37763828/javascript-es6-double-arrow-functions

官方例子：

getters: {
 // ...
 getTodoById: (state) => (id) => {
  return state.todos.find(todo => todo.id === id)
 }
}

使用：

store.getters.getTodoById(2) // -> { id: 2, text: '...', done: false }

stackoverflow 例子：

new Vuex.Store({
 getters: {
  someMethod(state){
   var self = this;
    return function (args) {
     // return data from store with query on args and self as this
    };
  }
 }
})

commit 带参数

参考； https://stackoverflow.com/questions/46097687/vuex-passing-multiple-parameters-to-action 和 https://stackoverflow.com/questions/40522634/can-i-pass-parameters-in-computed-properties-in-vue-js

就是把第二个参数，以hash的形式传过来。

// vue页面调用：
   store.commit(INCREASE, {
    vid: vid  // 这里可以容纳更多参数
   })

// store.js
const mutations = {
 [INCREASE](state, data){
  pair = state.pairs.find( (pair) => {
   return pair.vid == data.vid  // 注意这里的 data.vid 就是了。
  })
 }
}

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

赞 (0)

相关推荐

  • 解决$store.getters调用不执行的问题

    api:https://vuex.vuejs.org/zh/guide/getters.html 场景: 在登录时将登录得到的用户信息存储在vuex的state和sessionStorage中.使用时在state中获取,当因为刷新等原因导致state中没有数据时,去sissionStorage中获取. 错误: 登录后,需要获取用户信息时,getters中属性的方法不会执行.只是去getters中获取缓存 解决方法: 将getters中的属性改写成方法,这样每次调用的时候就会执行,去从新获取数据.

  • 详解vuex之store源码简单解析

    关于vuex的基础部分学习于https://www.jb51.net/article/163008.htm 使用Vuex的时候,通常会实例化Store类,然后传入一个对象,包括我们定义好的actions.getters.mutations.state等.store的构造函数: export class Store { constructor (options = {}) { // 若window内不存在vue,则重新定义Vue if (!Vue && typeof window !== '

  • 如何为vuex实现带参数的 getter和state.commit

    getter 带参数 参考: https://vuex.vuejs.org/guide/getters.html#method-style-access 或者: https://stackoverflow.com/questions/37763828/javascript-es6-double-arrow-functions 官方例子: getters: { // ... getTodoById: (state) => (id) => { return state.todos.find(tod

  • asp执行带参数的sql语句实例

    asp执行带参数的sql语句,需要向sql语句添加参数,可以有效屏蔽SQL注入,源代码如下: 复制代码 代码如下: var conn = Server.CreateObject("ADODB.Connection"); conn.ConnectionString = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + Server.MapPath("Test.mdb"); conn.Open();

  • js循环动态绑定带参数函数遇到的问题及解决方案[转]

    众所周知,不带参数的绑定非常简单,只要使用(语法:"document.getElementById("对象ID名").attachEvent("事件名,如onchange",函数名);")(示例:"document.getElementById("select_0").attachEvent("onchange",modifyFunction);")即可.(注:以下只写示例) 带参数的绑

  • Java程序打包成带参数的jar文件实例代码

    这里我们通过Apache Commons CLI来完成目标功能,废话不多说直接上代码 所需的maven依赖 <dependency> <groupId>commons-cli</groupId> <artifactId>commons-cli</artifactId> <version>1.4</version> </dependency> 这里我们贴出主类代码 Options opts = new Optio

  • Javascript生成带参数的二维码示例

    Javascript生成带参数的二维码示例

    前言 在最近的项目中有个需求是要生成带参的二维码,考虑过用JAVA后台生成返回前端展示,后面了解到用jquery的qrcode.js插件可以很好现实,下面话不多说,直接上实现的过程. 引入js: require.config({ baseUrl : "/", paths: { jquery:'plugin/jquery/jquery-3.1.0.min', qrcode:'plugin/qrcode/qrcode' } }); require( [ 'jquery', 'qrcode'

  • Bootstrap 模态框（Modal）带参数传值实例

    Bootstrap 模态框（Modal）带参数传值实例

    模态框(Modal)是覆盖在父窗体上的子窗体.通常,目的是显示来自一个单独的源的内容,可以在不离开父窗体的情况下有一些互动.子窗体可提供信息.交互等. 为了实现父窗体与其的交互,通常需要向其传值,实现带参数的传递,查看数据的唯一性.例如下面窗体:点击任意一个模态框("回复"按钮),如果不做任何处理,则会出现回复混淆,甚至程序出错的情况. 为了实现其回复的唯一性和带参传值的功能,需要做以下处理 实现的效果: 总结 以上所述是小编给大家介绍的Bootstrap 模态框(Modal)带参数传

  • Asp .net 调用带参数的存储过程

    1.后台调用带参数的存储过程详解 例: 注明:@AnalysisDate,@Process_PTR为存储过程参数 IDataParameter[] iDataDi = new SqlParameter[2]; iDataDi[0] = new SqlParameter("@AnalysisDate", showDate); iDataDi[1] = new SqlParameter("@Process_PTR", ID); //获取检测项所选日期的不同时间 dtDi

  • php微信开发之批量生成带参数的二维码

    php微信开发之批量生成带参数的二维码

    带参数的二维码对于渠道营销推广来说是很有用的,可以获得多个带不同场景值的二维码,用户扫描后,公众号可以接收到事件推送,可喜的是微信开通了这个接口,那下面就来研究一下吧.  具体接口说明请参见,微信公众平台开发者文档(http://mp.weixin.qq.com/wiki/18/28fc21e7ed87bec960651f0ce873ef8a.html) ,我这里就直接上代码.  演示图: 由于带参数二维码生成是有限的,所有我是按编号生成的,下次生成的时候直接累加. 另外带设置有备注,方便以后统

  • 微信接口生成带参数的二维码

    为了满足用户渠道推广分析的需要,公众平台提供了生成带参数二维码的接口.使用该接口可以获得多个带不同场景值的二维码,用户扫描后,公众号可以接收到事件推送. 用户扫描带场景值二维码时,可能推送以下两种事件: (1)如果用户还未关注公众号,则用户可以关注公众号,关注后微信会将带场景值关注事件推送给开发者. (2)如果用户已经关注公众号,在用户扫描后会自动进入会话,微信也会将带场景值扫描事件推送给开发者. 获取带参数的二维码的过程包括两步:(I)首先创建二维码ticket:(II)然后凭借ticket到

  • php微信开发之带参数二维码的使用

    php微信开发之带参数二维码的使用

    最近做微信PC端网页微信相关功能的开发,从一个新手的角度来说,微信公众号的文档还是不好理解的,网上找的帖子大都也都基本上是复制微信公众平台上给的文档,开发微信带参数二维码过程中还是遇到不少坑的,在此把我的开发过程比较详细的记录下,希望对大家有所帮助. 我本次开发使用的是认证服务号. 1 接入 首先进入微信公众号 -> 基本配置  下面是基本配置的页面,在URL中填写服务器地址,这个地址就是接受微信推送事件的一个接口,我是使用thinkPHP框架开发的程序,在其中一个Module(Decorati

随机推荐