将Redux Reducer转为TypeScript时遇类型分配错误求助

错误原因 #

你定义的TaskDataState接口中，status字段的类型是字面量联合类型（"pending" | "completed"），但初始状态里的status值（"pending"）被TypeScript自动推断为更宽泛的string类型，两者类型不兼容，因此抛出了类型不匹配的错误。

解决方法 #

有两种简单的修复方式：

方式1：给初始状态显式指定类型 #

直接将initialState的类型指定为TaskDataState，让TypeScript按照接口规则检查初始值，而非自动推断：

interface TaskDataState {
  taskData: {
    id: string;
    taskName: string;
    taskDescription: string;
    status: "pending" | "completed";
  }[];
}

// 显式指定类型
const initialState: TaskDataState = {
  taskData: [
    {
      id: "1",
      taskName: "Task 1",
      taskDescription: "Task 1 Description",
      status: "pending",
    },
  ],
};

方式2：使用as const断言锁定字面量类型 #

给初始状态里的status值添加as const断言，让TypeScript将其识别为字面量类型而非string：

const initialState = {
  taskData: [
    {
      id: "1",
      taskName: "Task 1",
      taskDescription: "Task 1 Description",
      status: "pending" as const,
    },
  ],
};

更规范的写法：单独定义Task接口 #

推荐把任务对象的类型抽成独立接口，让代码更清晰且易于维护：

// 单独定义任务项的类型
interface Task {
  id: string;
  taskName: string;
  taskDescription: string;
  status: "pending" | "completed";
}

// 状态接口依赖Task类型
interface TaskDataState {
  taskData: Task[];
}

// 显式指定初始状态类型
const initialState: TaskDataState = {
  taskData: [
    {
      id: "1",
      taskName: "Task 1",
      taskDescription: "Task 1 Description",
      status: "pending",
    },
  ],
};

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