在 react 组件构造函数中分配空状态的函数

Question

我找到了一些旧代码，它们曾经在构造函数中分配空状态。这是否有任何函数或可以删除整个构造函数？由于没有任何其他代码，我认为使用构造函数没有任何意义。

export default class MyComponent extends React.Component{
constructor(props){
super(props);
this.state = {};
}
render() {
return (<div title={this.state.title}></div>);
}
}

Answer 1

"无法读取 null 的属性'title' ">

this.state == null，如果你不定义它。

因此，如果要安全地引用任何子属性而不检查它们是否存在，则将默认值应用于state确实会有所不同。

Answer 2

可以安全地删除构造函数，因为您不初始化任何状态值，并且仅在初始化后使用它。对于您来说，当您在渲染中使用状态时，它仍然是必需的。仅当要初始化某些状态值或类变量时，才需要使用构造函数。但是babel-plugin-transform-class-properties插件，您可以将状态指定为类对象本身，例如

export default class MyComponent extends React.Component{
state = { isVisible: true };
}