reactjs - 如何将 useState 状态值传递给 useReducer 初始状态

Question

我想将一个值从 useState 状态值传递到 useReducer 初始状态。

const [item, setItem] = useState([]);

const initialState = {
    menuOpen: true,
    promoOpen: false,
    couponOpen: false,
    cartOpen: false,
    orderOpen: false,
    orderAmount: 1,
    filteredItem: item,
  };

const [state, dispatch] = useReducer(reducer, initialState);

const fetchUrl = async () => {
    const resp = await fetch(url);
    const respData = await resp.json();
    const item = respData.item;
    const category = respData.category;
    const promo = respData.promo;
    setItem(item);
    setCategory(category);
    setPromo(promo);
    setFilterItem(item);
  };

但是当我执行 console.log(state.filteredItem) 时，我得到一个空数组，因此我假设它没有将值传递给initialState。有没有办法让我将 useState 状态值传递给 useReducer 初始状态值？ 先谢谢了

Answer 1

您在这里尝试执行的操作不会起作用。 reducer 的初始状态就是 - INITIAL 状态。在使用获取结果更新您的 items 之前，它将使用第一次渲染时的 initialState 值。创建 reducer 后，对变量 initialState 的更改不会影响它。您必须调度一个操作来将items存储在您的reducer中。