使用TypeScript编写Pinia回调函数时遇never类型错误的解决方法

错误根源 #

1. State类型未明确声明：你的store中state.inProcess没有定义具体类型，TypeScript无法推断其元素类型，默认将其视为never[]，导致includes()方法只接受never类型参数，和传入的string不兼容。
2. 回调参数类型错误：你给some()的回调参数x标注为[]，这等价于never[]，同样导致x.includes(identification)出现类型不匹配。

修正方案 #

第一步：给State定义明确的类型 #

根据你的业务逻辑，先确定inProcess的元素类型：

• 如果inProcess是字符串数组：类型为string[]
• 如果inProcess是字符串数组的数组：类型为string[][]
• 如果inProcess是字符串或字符串数组的混合数组：类型为(string | string[])[]

以混合类型为例，在你的Pinia store中声明State接口：

interface YourStoreState {
  inProcess: (string | string[])[];
}

export const useYourStore = defineStore('yourStore', {
  state: (): YourStoreState => ({
    inProcess: [] // 初始化值
  }),
  // ...其他配置
});

第二步：修正Getter代码 #

移除回调参数x的错误类型标注，让TypeScript自动推断类型；同时确保逻辑符合你的业务需求：

getters: {
  isInProcess: (state: YourStoreState) => {
    return (identification: string, exact: boolean = true): boolean => {
      if (exact) {
        // 精确匹配：检查是否有完全等于identification的字符串元素
        return state.inProcess.some(item => typeof item === 'string' && item === identification);
        // 如果你原本的exact逻辑是检查元素是否包含该字符串（针对纯string数组），则用：
        // return state.inProcess.includes(identification);
      } else {
        // 模糊匹配：检查是否有数组元素包含identification
        return state.inProcess.some(item => Array.isArray(item) && item.includes(identification));
      }
    };
  },
},

针对纯字符串数组的简化情况 #

如果inProcess只是普通字符串数组，你的原逻辑可能是想在exact=false时检查元素是否包含该子串，那么代码可以简化为：

interface YourStoreState {
  inProcess: string[];
}

getters: {
  isInProcess: (state: YourStoreState) => {
    return (identification: string, exact: boolean = true): boolean => {
      return exact 
        ? state.inProcess.includes(identification) 
        : state.inProcess.some(item => item.includes(identification));
    };
  },
},

关键要点 #

• 始终给Pinia的State声明明确的TypeScript接口，避免TS自动推断出never类型。
• 不要随意给回调参数标注错误的类型（比如[]），让TS根据State类型自动推断即可。

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