React Redux，调度动态函数

Question

我正在构建一个使用 Redux 和 GraphQL 的相当大的应用程序。

我有一个房间有多种选择，用户可以选择。为了不重复代码或有 switch case 语句，因为选项总是动态的，我想分派一个动态调用的函数。

这是我的代码摘要。

const test = (optionTitle, cardIndex) => {
    dispatch(changeKitchenFront(cardIndex));
}

这是被触发的地方，在这种情况下，cardTitle 是动态的，基于单击的元素。

<div key={index} onClick={() => test(cardTitle, index)}>
  ...rest of the code
</div>

我试过这样做，但没有用：

const test = (optionTitle, cardIndex) => {
    dispatch(changeKitchen{$optionTitle}(cardIndex));
}

Answer 1

也许您可能想要一个包含具有正确功能的正确键的对象，例如：

const FN_TO_CALL = {
 front: changeKitchenFront,
 back: changeKitchenBack,
}

然后在测试函数中：

const test = (optionTitle, cardIndex) => {
    dispatch(FN_TO_CALL[optionTitle](cardIndex));
}

React Redux, dispatch dynamic function