小编JDa*_*oer的帖子

useState与useReducer

当您具有涉及多个子值的复杂状态逻辑时,或者当下一个状态取决于上一个状态时,useReducer通常比useState更可取。useReducer还可以让您优化触发深层更新的组件的性能,因为您可以传递调度而不是回调。

(引自https://reactjs.org/docs/hooks-reference.html#usereducer

我对粗体部分感兴趣,该部分指出useReduceruseState在上下文中使用而不是使用。

我尝试了两种变体,但它们似乎没有什么不同。

我比较这两种方法的方式如下:

const [state, updateState] = useState();
const [reducerState, dispatch] = useReducer(myReducerFunction);
Run Code Online (Sandbox Code Playgroud)

我将它们每个都传递给一个上下文对象,该上下文对象被一个更深的孩子使用(我只是运行了单独的测试,将值替换为要测试的函数)。

<ContextObject.Provider value={updateState // dispatch}>

孩子包含这些功能

const updateFunction = useContext(ContextObject);
useEffect(
  () => {
    console.log('effect triggered');
    console.log(updateFunction);
  },
  [updateFunction]
);

Run Code Online (Sandbox Code Playgroud)

在这两种情况下,当父级重新渲染时(由于另一个局部状态更改),效果永远不会运行,这表明在渲染之间更新功能未更改。我看错了引号中的粗体字吗?还是我忽略了什么?

reactjs react-hooks

11
推荐指数
2
解决办法
870
查看次数

标签 统计

react-hooks ×1

reactjs ×1