WebStorm 中的 Redux-toolkit 操作参数

Posted 2023-02-22

【中文标题】WebStorm 中的 Redux-toolkit 操作参数

【英文标题】：Redux-toolkit action arguments in WebStorm

【发布时间】：2021-02-04 02:29:17

【问题描述】：

我开始使用 redux 工具包，但是当我尝试发送带有参数的操作时，我收到了来自 IDE 的警告：

“参数类型 ... 不可分配给参数类型 payload: ...”

或“参数数量无效，应为 2”

我猜它认为状态应该是第一个参数。

有什么办法可以改正吗？

编辑： 我为这个特定问题找到了一个临时解决方案。 基本上，我所做的是将这些操作移出文件。

如果我之前有：

// reducer.js
const state = createSlice(
  // ...
  reducers: 
    handleNumber(state, action)
  
)

export const  handleNumber  = state.actions
export default state.reduer

现在我有：

// reducer.js
export const state = createSlice(
  // ...
  reducers: 
    handleNumber(state, action)
  
)

export default state.reducer

// actions.js
import  state  from './reducer'

export const  handleNumber  = state.actions

正如评论中所说。如果这些名称在同一个文件中，Webstorm 似乎可以匹配内容。但如果它们位于不同的文件中，它会查看 typescript 定义。

但它引发了另一个问题，现在当我 Ctrl + 单击 actions.js 中的函数名称时，它不是转到函数，而是导航到类型声明。

【参考方案1】：

RTK 共同维护者在这里。这看起来很好奇，绝对应该有效。 我想更深入地研究一下。能否请您创建一个包含此问题的复制存储库并将其发布到我们的 github 问题跟踪器？

【讨论】：

这里是repo，我还在assets文件夹中添加了一张图片。 github.com/andrei9669/redux-toolkit-webstorm

我明白了。与 VSCode 不同，它会在后台使用 TypeScript 编译器来找出方法的类型，即使您正在编写 javascript，WebStorm 似乎也只是按名称进行模式匹配。然后它不知道内部原理，只是“猜测”setNumberA 对应于 reducer 定义，这显然是错误的。我很抱歉这么说，但在这种情况下，只是工具较差。对此真的无能为力:(

看起来问题已经有一段时间了。 youtrack.jetbrains.com/issue/WEB-42559

【参考方案2】：

我遇到过类似的问题，我不确定是什么导致了问题，但我发现删除/重命名您的（隐藏的）.idea 文件夹很有用。之后重新启动 Webstorm，它应该会生成一个新的 .idea 文件夹。

所以问题似乎是Webstorm IDEA默认设置中的某些东西导致了这个问题。如果不确定是否要保留某些设置，请务必先重命名 .idea 文件夹。

希望这行得通！

【参考方案3】：

我遇到了同样的问题，但删除 .idea 并重新启动 ide 有效。

【讨论】：

您的答案可以通过额外的支持信息得到改进。请edit 添加更多详细信息，例如引用或文档，以便其他人可以确认您的答案是正确的。你可以找到更多关于如何写好答案的信息in the help center。