![](https://img-blog.csdnimg.cn/20201014180756913.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
react
live_upward
这个作者很懒,什么都没留下…
展开
-
虚拟DOM是怎么进行比对的
虚拟DOM 步骤 1、state数据 2、JSX模板 3、数据+模板 生成虚拟DOM (虚拟DOM就是一个JS对象,用它来描述真实DOM) (损耗了性能) ['div',{id:'abc'},['span',{},'hello world']] 4、用虚拟DOM的结构生成真实DOM来显示 <div id='abc'><span>hello world</span></div> 在render()中: JSX->createElement->原创 2020-07-15 20:38:59 · 458 阅读 · 0 评论 -
react性能提升
react常用性能提升 1、在constructor中修改函数的作用域 2、setState是个异步操作,可以把数次对数据的修改结合成一个,提高性能 3、虚拟DOM(同层比对、key) 4、shouldComponentUpdate 减少子组件的渲染频率,props发生变化时返回true重新渲染,否则返回false不进行渲染 5、在componentDidMount里发送ajax请求,而不是在render中(反复渲染) ...原创 2020-07-15 17:06:36 · 93 阅读 · 0 评论 -
react生命周期函数
生命周期函数指在某一时刻会自动调用执行的函数 Initialization(初始化阶段 初始化数据 比如说props state) 1、setup props and state Mounting(挂载阶段) 1、componentWillMount() 在组件即将被挂载到页面的时候自动执行(只会在第一次挂载时执行) 2、render() 3、componentDidMount() 组件被挂载到页面之后执行(只会在第一次挂载时执行) Updation(组件的更新流程) props发生变化时: 1原创 2020-07-15 16:47:37 · 96 阅读 · 0 评论