web-dev-qa-db-ja.com

Vuex - アクションに複数のパラメータを渡る

私はvuejsとlaravelのパスポートを使ってユーザーを認証しようとしています。

アクションを介して複数のパラメータをどのようにしてvuex変異に送信するのかわかりません。

- 店舗 - 

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)
    }
})

- ログイン方法 - 

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()
              })
     })
}



どんな種類の助けにもとても感謝しています！

vue.jsvuejs2vuex
60
Schwesi

stateとpayloadの2つの引数があります。ストアの現在の状態は、Vuex自身によって最初の引数として渡され、2番目の引数には渡す必要のあるパラメータがすべて含まれます。
いくつかのパラメータを渡す最も簡単な方法は、それらを破棄することです。

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

それから後であなたの行動のあなたは簡単にできる

commit('authenticate', {
    token,
    expiration
})
87
Nit

簡単に言えば、ペイロードをキー配列に構築する必要があります。

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

その後、ペイロードを直接アクションに送信します。

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

あなたの行動に変化はありません

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

あなたの突然変異のキーで値を呼び出します

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

、

58
peterretief