javascript 为什么我的 React 类没有调用 getInitialState?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/31709258/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Why is getInitialState not being called for my React class?
提问by ndbroadbent
I'm using ES6 classes with Babel. I have a React component that looks like this:
我在 Babel 中使用 ES6 类。我有一个如下所示的 React 组件:
import { Component } from 'react';
export default class MyReactComponent extends Component {
getInitialState() {
return {
foo: true,
bar: 'no'
};
}
render() {
return (
<div className="theFoo">
<span>{this.state.bar}</span>
</div>
);
}
}
It doesn't look like getInitialStateis being called, because I'm getting this error: Cannot read property 'bar' of null.
它看起来并不像getInitialState被调用,因为我得到这个错误:Cannot read property 'bar' of null。
回答by ndbroadbent
The developers talk about ES6 class support in the Release Notes for v0.13.0. If you use an ES6 class that extends React.Component, then you should use a constructor()instead of getInitialState:
开发人员在v0.13.0的发行说明中讨论了 ES6 类支持。如果您使用扩展的 ES6 类React.Component,那么您应该使用 aconstructor()而不是getInitialState:
The API is mostly what you would expect, with the exception of getInitialState. We figured that the idiomatic way to specify class state is to just use a simple instance property. Likewise getDefaultProps and propTypes are really just properties on the constructor.
除了 getInitialState 之外,该 API 主要是您所期望的。我们认为指定类状态的惯用方法是只使用一个简单的实例属性。同样, getDefaultProps 和 propTypes 实际上只是构造函数上的属性。
回答by Des Horsley
Code to accompany Nathans answer:
伴随内森回答的代码:
import { Component } from 'react';
export default class MyReactComponent extends Component {
constructor(props) {
super(props);
this.state = {
foo: true,
bar: 'no'
};
}
render() {
return (
<div className="theFoo">
<span>{this.state.bar}</span>
</div>
);
}
}
回答by CpILL
To expand a bit on what it means
稍微扩展一下它的含义
getDefaultProps and propTypes are really just properties on the constructor.
getDefaultProps 和 propTypes 实际上只是构造函数上的属性。
the "on the constructor" bit is weird wording. In normal OOP language it just means they are "static class variables"
“在构造函数上”位是奇怪的措辞。在普通的 OOP 语言中,它只是意味着它们是“静态类变量”
class MyClass extends React.Component {
static defaultProps = { yada: "yada" }
...
}
or
或者
MyClass.defaultProps = { yada: "yada" }
you can also refer to them within the class like:
您还可以在类中引用它们,例如:
constructor(props) {
this.state = MyClass.defaultProps;
}
or with anything you declare as a static class variable. I don't know why this is not talked about anywhereonline with regards to ES6 classes :?
或者任何你声明为静态类变量的东西。我不知道为什么在网上的任何地方都没有谈论ES6 类:?

