React componentDidUpdate生命周期以null prevState进入

Question

React 16.13.1

新手。

我将componentDidUpdate生命周期方法添加到我的组件中：

export default class MyComponent extends React.Component {
componentDidUpdate(prevProps, prevState) {
console.log('componentDidUpdate');
//this.state
}
render () { ... }

在onChange处理程序中，我更新状态并触发componentDidUpdate。然而，prevState输入为空。此外，在方法this.state中为空。

你知道我做错了什么吗？

Answer 1

首先初始化状态

使用constructor()，定义内部的状态数据结构，并设置其初始值。

class YourComponent extends React.Component<Props, State>{
static defaultProps = {
classes: {},
};
constructor(props: Props) {
super(props);
this.state = {
};
}
componentDidUpdate(prevProps, prevState) {
}
...
}

Answer 2

prevState指向更新之前的状态(道具或状态已更改(，因此在您的情况下，它应该为null。如果需要，可以初始化状态：

export default class MyComponent extends React.Component {
state = {} // initialize here
componentDidUpdate(prevProps, prevState) {
console.log('componentDidUpdate');
//this.state
}
render() { ... }
}