Everything in a Vuex Module is local to itself: the State
, Mutations
, Actions
, Getters
. But sometimes you need to call something from the outside. This lesson shows how you can call an external Mutation
and Action
from within a module in TypeScript.
Hi Alex, Great series. Thanks for putting it together. When I try to define the "state" object in the Vuex.Store instance in @/store/index.ts, I get the following error in VS Code for "state":
"Type '{count: number;}' is not assignable to type 'RootState | (() => RootState) | undefined. Type '{ count: number;)' is missing the following properties from type 'RootState': todos, login ts(2322) index.d.ts(91,3): The expected type comes from the property 'state' which is declared here on type 'StoreOptions<RootState>"
The only way I knew how to solve for this is to open types.ts and make todos and login optional under the RootState interface:
export interface RootState { count: number; todos?: TodoState; login?: LoginState; }
But, this seems like the wrong way to handle this. Did you encounter this at any point along the way? I'm curious as to your thoughts on this, although the example I recognize is somewhat contrived.
Thanks! -fermin
test
the better approach of it is export initState of todos/login and add them to the rootState import { initState as loginState } from "./login"; import { initState as todosState } from "./todos";
export default new Vuex.Store<RootState>({ state: { count: 0, todos: todosState, login: loginState }, modules: { todos } });