I'm new to Typescript and I'm exploring ways to add specific type structure to all Actions declared in Vue store without repeating them in every Vuex module file.
For instance, instead of manually defining types for each action in every store file, it can be done as shown below:
// Global interface declaration.
interface ReturnObject {
status: boolean;
msg: string;
}
export default new Vuex.Store({
actions: {
// Each action needs to follow this pattern.
exampleAction: async (context, payload): Promise<ReturnObject> => {
return { status: true, msg: 'Hello World!' }
},
},
modules: {
// Also applied to actions in module files.
}
})
However, the goal is to achieve the following approach:
export default new Vuex.Store({
actions: {
// Types are automatically inferred.
async exampleAction(context, payload) {
return {status: true, msg: 'Hello World!'}
}
},
modules: {
// Applied to actions in all module files.
}
})