reactjs - 使用 props 在 React 中设置初始状态，而不使用 React.createClass

Question

我想使用我的 props 中的数据来播种我的组件状态，如下例所示:https://facebook.github.io/react/tips/props-in-getInitialState-as-anti-pattern.html

getInitialState: function() {
    return {count: this.props.initialCount};
},

看看底部附近，它说“但是，如果你明确表示该 Prop 只是组件内部控制状态的种子数据，那么这不是反模式:”这正是我想要做的。

这在使用 React.createClass 时效果很好，但如果可能的话，我想使用 ES6 类来做到这一点。但是当使用 ES6 类时，初始状态作为类的静态属性提供。如果您尝试实现 getInitialState()，您将收到错误。这意味着在 Prop 可用后我没有机会计算它。请参阅标题为“ES7+ 属性初始值设定项”的部分:https://facebook.github.io/react/blog/2015/01/27/react-v0.13.0-beta-1.html#es7-property-initializers

在该部分中，他们提供了一个示例，其中通过在构造函数中简单设置 this.state 来类似于旧的 getInitialState 方法来计算初始状态。但是，当我尝试这个时，this.props 尚未设置。

我搜索了第一次设置 props 时的生命周期方法，以便我可以设置当时的状态，但我找不到任何这样的生命周期方法。

在使用扩展 React.Component 的 ES6 类时，我必须使用 React.createClass 还是有办法播种我的初始状态？

Answer 1

这是一个示例类，您可以在其中运行它

class Sample extends React.Component {
  constructor(props, context) {
    super(props, context);

    // replacement for componentWillMount
    this.state = {
      stateKey: props.stateVal
    };
  }

  render() {
    return (
      <div>{this.state.stateKey}</div>
    );
  }
}