React
文章平均质量分 64
XcantloadX
这个作者很懒,什么都没留下…
展开
-
【React】封装一个好用方便的消息框(Hooks & Bootstrap 实践)
即将模态框组件和状态以及处理函数都封装到一个 Hook 里,每次调用这个 Hook 都返回一个组件变量和 show 函数,调用方只需要把返回的组件变量渲染出来,然后调用 show 即可。为了解决上面只能同时弹一个框的问题,我们可以考虑取消全局只有一个对话框的策略,改成每个要用的组件都单独一个对话框,这样就不会出现冲突的问题了。首先可以考虑全局都只放一份模态框的代码到某个位置,然后要用的时候都修改这一个模态框即可。但是缺点显而易见,只能同时弹一个消息框,因为所有的消息框都要共享一个模态框。原创 2024-05-31 22:43:27 · 1099 阅读 · 0 评论 -
【React】函数式组件的 ref 结果为 undefined(useRef)
为了解决这个问题,需要引入 forwardRef 函数。forwardRef 函数能够让函数式组件接受 ref 属性,然后转发给其他可以处理 ref 的组件。对于类组件,ref 实际上指向的是类组件的实例。函数式组件没有实例,因此只能得到 undefined,同时 React 会给出警告。有时候并不需要保留 DOM 节点,而是想暴露一些属性或方法对外使用。例如将 ref 转发给 DOM 节点,这样就不会出现 undefined 了。函数式组件不能直接应用 ref。原创 2024-05-31 17:14:37 · 331 阅读 · 0 评论