react
state视图变化
在function组件
中,如果需要改变数据引起视图更新,必须将数据定义在useState中。使用useState更新数据才会触发视图更新
- 普通数据类型的变更无法触发视图更新
setState更新数据触发更新
umi+dva
避免effects、reducers同名
在models中定义的effects
和reducers
都可以通过dispatch
进行派发,派发方式:
dispatch({ type: 'namespace/xxx' })
如果在同一个namespace中存在effects
和reducers
的同名方法,使用dispatch
派发该方法会同时触发effects
和reducers
,若此时effects
该方法中同步调用了reducers
的该方法,这可能导致无限循环
useEffect和useLayoutEffect的区别
useEffect
useEffect
函数会在浏览器会在浏览器完成布局与绘制之后, 在一个延迟事件中被调用。
useLayoutEffect
其签名函数与useEffect
相同,但是它会在所有DOM变更(diff之后render之前)之后同步调用effect。可以使用它来读取DOM布局并同步触发重渲染。在浏览器执行绘制之前,useLayoutEffect
内部更新计划被同步刷新。 阻塞了浏览器的绘制
两者的区别
useEffect
是异步执行,在浏览器渲染之后执行。useLayoutEffect
是同步执行,在浏览器渲染之前更新,阻塞了浏览器的绘制