react.js - React 的 reduxjs/toolkit 在 typescript 报错的原因？

Question

报错：TS2322: Type  any  is not assignable to type  never 

const ErrorSlice = createSlice({    name: 'error',    initialState: [],    reducers: {        Publish: (state, action) => {            console.log(action)            state = [...state, action.payload]        },        Consume: () => [],    }})

调用端

await axios    .post(`host`, Params)    .then((data: Response) => data.data.Response)    .catch((e) => {        ErrorState.dispatch(Publish(e.response.data.Error))    })

我不太明白 never 什么意思我给的不是字符么很明显的

Answer 1

需要使用插件自己的数据类型 PayloadAction

import { createSlice, PayloadAction } from '@reduxjs/toolkit'const ErrorSlice = createSlice({    name: 'error',    initialState: "",    reducers: {        Publish: (_, action: PayloadAction<你自己的类型或者基础类型>) => action.payload,        Consume: () => "",    }})

• 参考：https://redux.js.org/usage/usage-with-typescript#standard-red...

Answer 2

"never" 是 TypeScript 的一个类型，表示一个永远不会出现的值。在函数中，如果你没有返回任何值（或者抛出一个错误），那么 TypeScript 会推断返回类型为 "never"。在你的代码中，Publish reducer 没有返回任何值，所以它的类型被推断为 "never"，而你的状态被定义为 "any"，所以 TypeScript 报错。

解决这个问题的一种方法是显式地指定 Publish reducer 的返回类型。由于你希望将新的错误添加到状态中，所以你应该返回一个新的状态。你可以使用 ...state 来创建新的状态，因为 TypeScript 可以推断出 "never" 类型应该被扩展成一个数组。

下面是修改后的代码：

const ErrorSlice = createSlice({    name: 'error',    initialState: [],    reducers: {        Publish: (state, action) => {            console.log(action);            return [...state, action.payload]; // 注意这里返回新的状态        },        Consume: () => [],    }});

现在，你的 Publish reducer 返回一个新的状态，TypeScript 应该不会报告任何错误了。