JavaScript

超轻量级php框架startmvc

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

更新时间:2020-08-10 17:36:01 作者:startmvc
getter带参数参考:https://vuex.vuejs.org/guide/getters.html#method-style-access或者:https://stackoverflow.com/

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 就是了。
 })
 }
}

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

vuex getter vuex state.commit