Сохранение данных в локальное хранилище с использованием постоянного состояния vuex - PullRequest
0 голосов
/ 28 января 2019

В настоящее время я использую этот плагин vuex-persistedstate

, и я хотел бы использовать его с модулем Vuex моего приложения Nuxt.

В принципе, у меня есть модуль входа в систему в случае успеха, затем сохраните authToken из ответа на localStorage

Вот мой код:

import axios from "axios";
import createPersistedState from 'vuex-persistedstate';

export const state = () => ({
  signInAttrs: {
    email: "",
    password: ""
  },
  authToken: ""
});

export const mutations = {
  SET_AUTH_TOKEN(state, token) {
    state.authToken = token;


    createPersistedState({
      key: 'admin-auth-key',
      paths: [],
      reducer: state => ({
        authToken: '123123123'
      })
    })(store);
  }
};

export const actions = {
  signInAdmin({ commit }, context) {
    return axios.post(`${process.env.BASE_URL}/sign_in`, {
      email: context.email,
      password: context.password
    }).then(response => {
      commit('SET_AUTH_TOKEN', response.data.headers.token);
    }).catch(error => {
      console.log(`failed ${error}`);
    });
  }
};

export const getters = {
  signInAttrs(state) {
    return state.signInAttrs;
  },
  authToken(state) {
    return state.authToken;
  }
};

Внутримутации есть SET_AUTH_TOKEN, который получает токен в качестве параметра от API.Как я могу сохранить его в localStorage?

1 Ответ

0 голосов
/ 28 января 2019

Я думаю, вы неправильно понимаете использование vuex-persistedstate.Как только вы добавляете его в плагины Store (plugins: [createPersistedState()]), он автоматически обновляет переменную localStorage vuex с копией вашего хранилища при каждой фиксации мутации (см. пример ).Таким образом, ваш токен должен быть уже внутри vuex.authToken в localStorage.

Если вы хотите просто сохранить переменную с произвольным именем, вы можете сделать это без плагинов: localStorage.setItem('key', 'value').См этот вопрос .

...