I am facing an issue with vuex-typescript where the initial state is always undefined. However, it works fine when I reset the state and refresh the window. Below is my setup for a simple module:
import Vue from "vue";
import Vuex from "vuex";
import { module } from "./some_module";
let store = new Vuex.Store({
modules: {
module,
},
plugins: [persist({
namespace: "mainnamespace",
initialState: {
},
expires: 7 * 24 * 60 * 60 * 1e3 // 1 week
})
]
});
some_module.ts
export interface State {
something: any;
}
const state: State = {
something: [],
};
export const module = {
namespaced: true,
getters: {
getSomethingArray: (state: State) => {
return state.something;
},
},
mutations: {
resetState: (s: State) => {
const initial = state;
Object.keys(initial).forEach(key => { s[key] = initial[key]; });
},
}
actions: {///}
}
const { commit, read, dispatch } =
getStoreAccessors<HistoryState, any>("somemodule");
const mutations = module.mutations;
const getters = module.getters;
const actions = module.actions;
export const getSomeStuffFromHere = read(getters.getSomethingArray);
When I run the app and
console.log(getSomethingArray(this.$store))
, I receive undefined
. Upon inspecting this.$store
, I can see the somemodule namespace
but its state is not something: []
instead it shows some __ob__: Observer
.