React
文章平均质量分 82
Jas555
这个作者很懒,什么都没留下…
展开
-
结合 useContext 和 useReducer ( redux 效果)
使用Context相比回调函数的优势:对比回调函数的自定义命名,Context的Api更加明确,我们可以更清晰的知道哪些组件使用了dispatch、应用中的数据流动和变化。这也是React一直以来单向数据流的优势。更好的性能:如果使用回调函数作为参数传递的话,因为每次render函数都会变化,也会导致子组件rerender。当然我们可以使用useCallback解决这个问题,但相比useCallbackReact官方更推荐使用useReducer,因为React会保证dispatch始终是不变的,不会引原创 2022-04-14 13:43:30 · 3503 阅读 · 0 评论 -
useReducer 介绍和基本使用
一、前言useReducer 是 useState 的替代方案。它接收一个形如 (state, action) => newState 的 reducer,并返回当前的 state 以及与其配套的 dispatch 方法。(如果你熟悉 Redux 的话,就已经知道它如何工作了。)const [state, dispatch] = useReducer(reducer, initialArg, init);useReducer接收两个参数:第一个参数:reducer函数。第二个参数:初始化原创 2022-04-14 13:39:26 · 21452 阅读 · 1 评论 -
useContext 介绍和基本使用
一、前言Context 设计目的是为了共享那些对于一个组件树而言是“全局”的数据,例如当前认证的用户、主题或首选语言。使用 context, 我们可以避免通过中间元素传递 props。const value = useContext(MyContext);接收一个 context 对象(React.createContext 的返回值)并返回该 context 的当前值。当前的 context 值由上层组件中距离当前组件最近的 <MyContext.Provider> 的 value pr原创 2022-04-14 13:38:43 · 3058 阅读 · 0 评论