Reactjs 添加Redux状态值

我想把两个单独的价格合并成一个总价。我存储了两个单独的价格状态，并使用独立的还原器正确更新，但我需要一种方法将这两个动态值合并到第三个总价格状态中

import React, {useState} from "react";
import { useSelector, useDispatch } from "react-redux";

const planPrice = useSelector(state => state.planPrice);
const repairPrice = useSelector(state => state.repairPrice);

//Use the state hook to store the Total Price
const [totalPrice, setTotalPrice] = useState(0);

const [items, setItems] = useState([]);

function addItem (newItem) {
    setItems((prevItems) => {
        return [...prevItems, newItem];
    });

    //Update the Plan Price
    if ({plan}.plan === "Premium") {
        dispatch(addItemPremium());
    } else if ({plan}.plan === "Basic") {
        dispatch(addItemBasic());
    }

    //Update the Repair Price
    if (newItem === "Small Chip") {
        dispatch(addSmallChip());
    } else if (newItem === "Big Chip") {
        dispatch(addBigChip());
    }

    // //Update the Total Price
    setTotalPrice({planPrice} + {repairPrice});
}

---

这是否可能使用ReDux，或者我是用错误的方式来处理这个问题吗？

如果你已经派生了状态，你应该考虑使用选择器。这些函数将状态作为参数并返回派生状态值

例如：

功能总价（状态）{
返回state.price1+state.price2；
}

如果需要在

mapStateToProps

中使用此选项，可以按如下操作：

const-mapStateToProps=state=>({
价格：总价（州）
})

如果使用钩子，则可以使用钩子：

const price=useSelector（总价）；

有一些库（例如）可以帮助您创建具有缓存的可组合选择器，以提高效率

---

请注意，您应该使用选择器而不是存储冗余状态的原因，正如您直觉所示，是冗余状态可能会失去同步，然后您就被套住了。但是，如果您有一个计算总价的函数，它将始终与各个州的零件保持同步。

嘿，尼克，感谢您的快速响应。我正在使用useSelector钩子成功地呈现组件中的各个价格状态，但我无法使用函数将两个价格相加。我也尝试了一种使用状态钩子的方法，但是由于某种原因，{state1}+{state2}没有返回我需要的总价状态的期望结果。你还可以提出其他想法吗？你能提供你在问题中使用的代码吗？选择器绝对是普遍接受的方法，因此我怀疑您的代码需要一些额外的疑难解答。我用所有相关的代码更新了我的问题（我想）。你想将它存储在redux状态，并在其他组件的其他地方使用它吗？您可以创建action creator，并将总价作为参数传递，然后分派一个将总价放入其自己的状态变量throw中的操作，并抛出其自己的减缩器（如果您使用的是单独的减缩器）。