如何正确推导Redux Toolkit Slice的泛型类型？

问题根源 #

你当前的工具函数泛型参数声明顺序和约束逻辑导致TypeScript无法正确推导类型：

• 前置的TState、TCaseReducers、TName泛型参数没有足够的上下文让TypeScript推断出具体类型，只能默认解析为unknown和宽泛的string
• 后续的TSliceFactory约束依赖这些未正确推断的前置参数，最终导致类型不匹配错误

修复方案 #

不需要提前声明TState等独立泛型参数，直接让TypeScript推导整个切片工厂函数的类型即可。有两种常用写法：

写法1：直接约束工厂函数类型 #

import { Slice, SliceCaseReducers } from '@reduxjs/toolkit';

function checkType<T extends () => Slice<any, SliceCaseReducers<any>, string>>(sliceFactory: T) {
    return sliceFactory;
}

写法2：提取切片类型并复用（如需在函数内使用状态/ reducer类型） #

如果需要在工具函数内部访问TState、TCaseReducers等类型，可以通过ReturnType从工厂函数中提取：

import { Slice, SliceCaseReducers } from '@reduxjs/toolkit';

function checkType<T extends () => Slice<any, SliceCaseReducers<any>, string>>(sliceFactory: T) {
    // 从工厂函数返回值中提取具体类型
    type SliceReturnType = ReturnType<T>;
    type TState = SliceReturnType['state'];
    type TCaseReducers = SliceReturnType['caseReducers'];
    type TName = SliceReturnType['name'];

    // 这里可以基于这些类型做后续逻辑处理
    return sliceFactory;
}

效果验证 #

使用修复后的checkType函数，const result = checkType(sliceFactory);的typeof result会和Test1完全一致，保留切片的所有类型细节：

() => Slice<{
        query: string;
        }, {
            startSearch(state: WritableDraft<{query: string;}>): void;
            changeQuery(state: WritableDraft<{query: string;}>, 
                action: { payload: any; type: string;}): void;
        }, "addExercise">

内容的提问来源于stack exchange，提问作者loromagnoni