![](https://img-blog.csdnimg.cn/20201014180756724.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
React
不知何未
这个作者很懒,什么都没留下…
展开
-
控制非 React 小部件
例如,如果你有一个没有使用 React 编写的第三方地图小部件或视频播放器组件,你可以使用 Effect 调用该组件上的方法,使其状态与 React 组件的当前状态相匹配。在本例中,不需要 cleanup 函数,因为 MapWidget 类只管理传递给它的 DOM 节点。从树中删除 Map React 组件后,DOM 节点和 MapWidget 类实例都将被浏览器的 JavaScript 引擎的垃圾回收机制自动处理掉。有时,你希望外部系统与你组件的某些 props 或 state 保持同步。转载 2023-06-28 17:23:08 · 77 阅读 · 0 评论 -
React useCallback 性能学习
useCallback性能问题?转载 2022-11-28 10:30:00 · 145 阅读 · 0 评论 -
React useEffect里使用state,不依赖state
useEffect里使用到currentState,如果 [ ] 不填写currentState的话,会报黄色警告这里的defaultState是一个对象,里面包含new Date()实时更新的值const [ currentState, setCurrentState ] = useState(defaultState)useEffect(() => { // prevState为上一次的状态(previous) setCurrentState(prevState) => {原创 2022-01-06 17:13:41 · 783 阅读 · 0 评论 -
React 单文件导出多个组件,引用方式为Parent.Child
使用方式类似于 Ant Design 的Tabs组件Tabs文件夹下的tabs.jsxconst Tabs = ({ children }) => { return ( <> <h6>Title</h6> <div>{children}</div> </> )}const TabPane = ({ children }) => { return ( <div>原创 2022-01-06 16:57:53 · 1497 阅读 · 0 评论 -
React 函数式组件 父子传值
parent.jsimport React,{ useRef } from 'react'import Child from './child'function Parent(){const childRef = useRef()const props = { list : ['1', '2', '3'], getChildData: (data) => { const nowList=['4', '5', '6'] // 父组件调用子组件的方法 childR原创 2021-08-23 12:00:06 · 1672 阅读 · 0 评论 -
React createPortal() 使用场景
ReactDOM.createPortal(child, container)Portal 将提供一种将子节点渲染到 DOM 节点中的方式,该节点存在于 DOM 组件的层次结构之外。因此 Portals 适合脱离文档流(out of flow) 的组件,特别是 position: absolute 与 position: fixed的组件。比如模态框,通知,警告,goTop 等<html> <body> <div id="root"></di原创 2021-12-14 17:44:08 · 7034 阅读 · 0 评论