2回答

张轩

2022-10-06

已采纳

同学你好 我的例子不是单个文件的 是多个文件的，我再简单写一遍，你再理解一下。

首先在 store/index.ts 当中

// 创建一个全局的类型，这个类型包括了所有子模块的类型
import { IuserState } from './user'
export interface GlobalDataProps {
   // 每个模块的类型都导入进来 
    user: IuserState;
    global: GlobalStatus;
    ... 可以更多
}

// 创建全局的 store，注意这里会使用这个全局的类型传入泛型
 export default createStore<GlobalDataProps>({
    modules: {
        user,
        global
    },
});

然后是每个模块当中，这里用 User 举例，user.ts

// 要使用 Module 类型, 它可以很方便的给你的 module 添加类型
import { Module } from 'vuex'
import {  GlobalDataProps } from './index'
// 定义module 的时候接受两个泛型，第一个是自己的类型，第二个是全局的类型，
// 你使用以后就会发现里面的各种参数获得对应的类型了， 不用想你图中那样手动指定了。
const user: Module<IuserState, GlobalDataProps> = {
    state: ...
    mutations: {
        setToken(state, token) {
            // 这里你会发现 state 不用指定类型也会获取对应的类型
        }
    }
}

在外面使用 store 的时候，比如某个 vue 文件中

import { GlobalDataProps} from '../store'
const store = useStore<GlobalDataProps>()
// 这样就可以获取 store 的类型了

0

1

慕尼黑8466541

感谢老师的耐心并精彩的回复，谢谢您了

2022-10-07

共1条回复

张轩

2022-10-05

同学你好

我在项目中都是这样做的。

// 先说 index.ts
// 单独添加一个对应的全局type，如下
export interface GlobalDataProps {
   // 每个模块的类型都导入进来 
    user: UserProps;
    global: GlobalStatus;
    ... 可以更多
}

// 创建全局

export default createStore<GlobalDataProps>({
    modules: {
        user,
        global
    },
});

// 使用的时候使用全局类型即可

// 在说单个文件
// 要使用 Module 类型
import { Module } from 'vuex'
// 定义module 的时候接受两个泛型，第一个是自己的类型，第二个是全局的类型，
// 你使用以后就会发现里面的各种参数获得对应的类型了， 不用想你图中那样手动指定了。
const user: Module<UserProps, GlobalDataProps>

亲测可用

0

1

慕尼黑8466541

老师您好，单个文件内写不来，能否写个例子

2022-10-05

共1条回复