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));
}