React重置非受控组件state的方法
2024-08-27 02:31:53
如果想通过props来重置state的值。有3种方法：
1. 最好的方法：key属性
修改key属性的值，可以使组件卸载后重新加载。所有的状态全部重置。
这种情况可以给key设一个每次渲染都会改变的值。
而且在多层嵌套的情况下，避免了组件的diff。
（递归实现树状级联组件，且节点带有状态时，每次都需要重置状态state）
2. 比较特殊属性：getDerivedStateFromProps
在getDerivedStateFromProps周期中，比较props.id的值，来更新state
3. 通过ref调用实例
class App extends React.Component {
constructor(props) {
super(props);
this.ref = React.createRef();
}
componnetDidMount() {
// this.ref.current指向子组件的实例对象this
this.ref.current.resetData()
}
render() {
// 只能是类子组件
return <Child ref={this.ref}>
}
}
class Child extends React.Component {
resetData = () => {
// TODO
}
render() {
return <div></div>
}
}
最新文章
- 分分钟带你玩转 Web Services
- Myeclipse导包总是报错，jar包路径都没问题
- WebView 与PC机Chrome配合调试
- url参数中带有+号，服务器端解码之后没了
- 第四周作业-yjw
- 转：DataTable的Compute方法的应用
- Tip8:Unity中诸如 Awake() Start() Update()等函数的 执行顺序
- orale内置函数COALESCE和GREATEST和LEAST
- PDO基础知识
- Qt5 FOR WINCE7, Visual Studio 2008环境的搭建
- Chapter 1 First Sight——14
- 初识mybatis(二)
- hello1源代码分析
- rsyslog磁盘辅助(Disk-Assisted)模式踩坑记
- Spring Boot 系列 - WebSocket 简单使用
- 读书笔记--Android Gradle权威指南（上）
- java开发基础知识学习
- mysql数据库字符集相关操作（修改表字段编码，使其支持emoji表情）
- python---django中序列化
- shell test条件判断