Bokk的博客

目录前言一、background1.1 需求1.2 example二、实现2.1 example2.2 useToggle实现2.3 设计新的dispatch2.4 调用user的onChange逻辑2.5 final veriosn总结前言最近开始学习React，跟着Kent学，有很多干货，这里分享Rect中的一个设计模式Control Props，这个设计方法跟React中的Control Component文章中完整的示例代码可以查看 这里一、background1.1 需求有时候用户希

目录前言一、background前言最近开始学习React，跟着Kent学，有很多干货，这里分享Rect中的一个设计模式方法重写或者是控制反转IoC，就是用户可以根据API提供的方法重写某些方法以满足设计需求，这样也满足了对修改封闭，对扩展开放原则一、background用户的需求是时刻变化的，之前提供的API可能不完全cover用户的需求，这时候就需要给API做扩展；具体的例子比如是reducer给接受的action中的方法需要改变...

目录前言一、background二、原型2.1 example2.2 实现2.3 改进总结前言最近开始学习React，跟着Kent学，有很多干货，这里分享Rect中的控制反转Inversion of Control这里还是讨论props传递的问题，之前React中的设计模式 - 组合组件(上) 以及React中的设计模式 - 组合组件(下) 已经讨论过很多模式，本文讨论利用控制反转，让组件使用者调用props, 而不是被动从父组件接受props文章中完整的示例代码可以查看 这里一、back

目录前言一、background二、解决办法2.1 初始方案2.2 使用hook2.3 子组件获取属性总结前言最近开始学习React，跟着Kent学，有很多干货，这里分享Compound Components组合组件的第二种模式文中完整的示例代码可以查看 这里一、background之前在React中的设计模式 - 组合组件(上)中，我们提到可以通过cloneElement的方法修改给子组件加属性，从而不需要通过props向下传递，但是如果遇组件跟DOM元素嵌套之后，这个方法就不能用了，情况如

目录前言一、background1.1 example1.2 需求二、React的组合模式2.1 需求2.2 设计2.3 新的设计2.4 支持DOM元素总结前言最近开始学习React，跟着Kent学，有很多干货，这里分享Compound Components组合组件文中完整的示例代码可以查看 这里一、background1.1 example组合模式是backend的一个概念，但是frontend其实也是有类似的设计模式的，比如select跟options的组合<select>

目录前言一、background1.1 一般context的使用1.2 提出问题1.3 提出解决方案1.4 最佳实践总结前言最近开始学习React，跟着Kent学，有很多干货，这里分享Context API一、background1.1 一般context的使用如果大家使用过Reducer，那么以下的场景不会陌生/ src/context/counter.jsconst UserContext = React.createContext()function UserProvider({