vuex types enhance
npm install vuex-ts-enhanceenhance types from vuex
it will check mapXXXX() params for state, getters, actions, mutations in store
but dispatch is different
``typescript`
const state = {};
const s = new EnhanceStore(state);
export const { dispatch } = s;
dispatch('rootAction')('payload');
dispatch('namespace', 'action')('payload');
check for typescript
check for return type
tips from vscode
use EnhanceStore to create store
`ts
import { EnhanceStore } from 'vuex-ts-enhance';
import Vuex from 'vuex';
import Vue from 'vue';
Vue.use(Vuex);
// state cannot be declared
const state = {
// your state
};
const s = new EnhanceStore(state);
export const {
mapGetters,
store,
mapActions,
dispatch,
mapState,
mapMutations,
} = s;
`
`html
{{getName}} {{getUsername}} {{getUsername1}}
`
Note
if write in js and your getter or actions is empty, you must to declare it
`js`
// store.js
/**
* @constant
* @type {import('vuex').GetterTree}
*/
const getters = {};
/**
* @constant
* @type {import('vuex').ActionTree}
*/
const actions = {};
/**
* @constant
* @type {import('vuex').MutationTree}
*/
const mutations = {};
- You can't defined state as StoreOptions
`typescript`
const state: StoreOptions
- You must be defined context as any if use jsdoc for types
`javascript`
const state = {
actions: {
/**
* @param {any} context
* @param {string} payload
*/
someActions(context, payload) {},
},
};
- git clone project
-
- edit dev files
- add test case