
获得徽章 1
- 今日打卡
状态管理:常用于组件之间的状态传递,包括
父子组件的props
跨组件传递的context
此外提供的第三方版本redux、mobx等各有侧重。评论点赞 - 今日打卡
const newFn = useCallback(() => fn, [dependences])
// 等价
const newFn = useMemo(() => {() => fn}, [dependences])评论点赞 - 今日打卡
setState在React18后默认是异步的,即多个更新集中在一个render周期中处理,使用flushSync函数,可以实现同步的状态更新,出入的参数是要执行的函数。赞过评论1 - 今日打卡
react hooks1
const [data, setData] = setState(0)
此时就等效于
constructor() {
super()
this.state = {
data: 0;
}
}
setDate = (newData) => {
this.setState({
data: newData
})
}
即 setState 函数返回了对应的状态和修改状态的方法。
setState 是通过插入状态实现有状态的函数组件的。
可以插入多个状态,即使用多个 setState 函数。
此时,react是根据 setState 调用的顺序,实现每次渲染时,得到对应状态之前的数据。
实际上,setState通过其函数的特点,使得每次插入的状态有一个独立的内存空间。
这是setState区别于mixin方式的地方。
mixin的区别在于它混入组件的状态共用一块内存空间,此时对于不同的组件可能需要不同的状态,因此产生了冲突,使得mixin方法只能在有限的范围内使用。展开评论点赞 - 今日打卡
react跨组件传输context
const MyContext = React.createContext()
<MyContext.Provider value={{ color: blue }} 发送的数据,是一个对象>
接收数据的组件,组件及其后代均可接收
</MyContext.Provider>
Class.contextType = MyContext
this.context = 传来对象
<MyContext.Consumer>
{
value => {}
使用函数返回使用传来对象value的子组件
}
</MyContext.Consumer>展开评论点赞 - 今日打卡
react props 类型检测和默认值
import PropTypes from 'prop-types'
App.PropTypes = {}
App.defaultProps = {}评论点赞