Vuex - passando vários parâmetros para mutação

Estou tentando autenticar um usuário usando o passaporte do vuejs e do laravel.

Não consigo descobrir como enviar vários parâmetros para a mutação vuex por meio de uma ação.

- loja -

export default new Vuex.Store({
    state: {
        isAuth: !!localStorage.getItem('token')
    },
    getters: {
        isLoggedIn(state) {
            return state.isAuth
        }
    },
    mutations: {
        authenticate(token, expiration) {
            localStorage.setItem('token', token)
            localStorage.setItem('expiration', expiration)
        }
    },
    actions: {
        authenticate: ({ commit }, token, expiration) => commit('authenticate', token, expiration)
    }
})

- método de login -

login() {
      var data = {
           client_id: 2,
           client_secret: '**************************',
           grant_type: 'password',
           username: this.email,
           password: this.password
      }
      // send data
      this.$http.post('oauth/token', data)
          .then(response => {
              // send the parameters to the action
              this.$store.dispatch({
                  type: 'authenticate',
                  token: response.body.access_token,
                  expiration: response.body.expires_in + Date.now()
              })
     })
}

Ficaria muito grato por qualquer tipo de ajuda!

As mutações esperam dois argumentos: stateepayload , onde o estado atual da loja é passado pelo próprio Vuex como o primeiro argumento e o segundo argumento contém todos os parâmetros que você precisa passar.

A maneira mais fácil de passar uma série de parâmetros é destruí-los :

mutations: {
    authenticate(state, { token, expiration }) {
        localStorage.setItem('token', token);
        localStorage.setItem('expiration', expiration);
    }
}

Então, mais tarde em suas ações, você pode simplesmente

store.commit('authenticate', {
    token,
    expiration,
});

Em termos simples, você precisa construir sua carga útil em uma matriz de chave

payload = {'key1': 'value1', 'key2': 'value2'}

Em seguida, envie a carga útil diretamente para a ação

this.$store.dispatch('yourAction', payload)

Nenhuma mudança em sua ação

yourAction: ({commit}, payload) => {
  commit('YOUR_MUTATION',  payload )
},

Em sua mutação, chame os valores com a chave

'YOUR_MUTATION' (state,  payload ){
  state.state1 = payload.key1
  state.state2 =  payload.key2
},

Eu acho que isso pode ser tão simples, vamos supor que você passará vários parâmetros para sua ação conforme você lê, as ações aceitam apenas dois parâmetros contexte payloadquais são os dados que você deseja passar em ação, então vamos dar um exemplo

Configurando Ação

ao invés de

actions: {
        authenticate: ({ commit }, token, expiration) => commit('authenticate', token, expiration)
    }

Faz

actions: {
        authenticate: ({ commit }, {token, expiration}) => commit('authenticate', token, expiration)
    }

Ação de chamada (despacho)

ao invés de

this.$store.dispatch({
                  type: 'authenticate',
                  token: response.body.access_token,
                  expiration: response.body.expires_in + Date.now()
              })

Faz

this.$store.dispatch('authenticate',{
                  token: response.body.access_token,
                  expiration: response.body.expires_in + Date.now()
              })

espero que isso ajude