vuex@4与Typescript

vuex@4与Typescript

简单分享一个使用Typescript给vuex的state加上类型检测的方式。只能对state有进行类型声明.

其他优秀解决方案,文末附跳转链接.

正文

简单搭建store结构

store/index.ts 根state

import {
    createStore } from 'vuex';
// 导入子模块
import home from './home/home';
import login from './login/login';
// 导入根模块类型
import type {
    IRootState } from './types';

// 在调用createStore是传入一个自己root的type
const store = createStore<IRootState>({
   
  state: () => {
   
    return {
   
      name: 'red',
      age: 20
    };
  },
  getters: {
   },
  mutations: {
   },
  actions: {
   }
});

export default store;

store/home/home.ts 子模块home