关于useControllableValue这个hooks的实现,有些问题想请教下? #2117
Replies: 1 comment
-
虽然useControllableValue用的是ref来存储数据,但是再数据变更的时候调用了
useUpdate,实质上还是useState进行变更 |
Beta Was this translation helpful? Give feedback.
-
虽然useControllableValue用的是ref来存储数据,但是再数据变更的时候调用了
useUpdate,实质上还是useState进行变更 |
Beta Was this translation helpful? Give feedback.
-
https://zhuanlan.zhihu.com/p/536322574
最近自己在写一个组件库,偶然看到了antd-mobile团队成员的这篇文章,感觉他们的实现和ahooks的useControllableValue差不多
如这篇文章中提到的,最后用了ref来解决数据同步和性能的问题,但是我注意到一些比较有名的开源组件库里的实现貌似有所不同
比如:
https://github.com/mui/material-ui/blob/master/packages/mui-utils/src/useControlled.js
https://github.com/chakra-ui/chakra-ui/blob/main/packages/hooks/use-controllable-state/src/index.ts
https://github.com/radix-ui/primitives/blob/main/packages/react/use-controllable-state/src/useControllableState.tsx
https://github.com/microsoft/fluentui/blob/master/packages/react-hooks/src/useControllableValue.ts
这些库里的实现还是直接用的useState,然后没有考虑props的value变化时去同步hooks中的value(有的还是用的useEffect去同步props值的变化),这些库的方案貌似并没有兼顾文章中提到的数据同步和性能的问题(要么只处理了数据同步,要么只处理了性能问题)?所以最优方案还是使用ref来同步数据和避免rerender吗?
Beta Was this translation helpful? Give feedback.
All reactions