powerdong / myProblems

我用到了,你可能用到
0 stars 1 forks source link

Vuex mutation 传值问题 #3

Open powerdong opened 4 years ago

powerdong commented 4 years ago

在使用action 调用 mutation 方法传值中,当你传两个参数时会发现第一个参数可以获取到,而第二个参数穿不过来

// action.js
export const actions = {
  getListTrackPageInfoAction: ({
    commit
  }, options) => {
    const {
      data,
      data: {
        totalRecord,
        pageSize
      }
    } = res
    const {
      listResult
    } = data
    commit('setListPageOptions', totalRecord,pageSize)

// mutations.js
export const mutations = {
setListPageOptions(state,totalRecord,pageSize) {
    state.listPageOptions.totalRecord = totalRecord // 可以获取到
    state.listPageOptions.pageSize = pageSize // undefined
  }
}

这时你需要将传入的参数转换为对象的形式传值,具体原因未知。。。

Vuex 文档这样写道 在大多数情况下,载荷应该是一个对象,这样可以包含多个字段并且记录的 mutation 会更易读:

所以,上边的代码简单改成这样就可以了

// action.js
export const actions = {
  getListTrackPageInfoAction: ({
    commit
  }, options) => {
    const {
      data,
      data: {
        totalRecord,
        pageSize
      }
    } = res
    const {
      listResult
    } = data
   -  commit('setListPageOptions', totalRecord,pageSize)
   +  commit('setListPageOptions', {totalRecord,pageSize})

// mutations.js
export const mutations = {
- setListPageOptions(state,totalRecord,pageSize) {
+ setListPageOptions(state,{totalRecord,pageSize}) {
    state.listPageOptions.totalRecord = totalRecord // 可以获取到
    state.listPageOptions.pageSize = pageSize // 可以获取到
  }
}