このバベルのドキュメントによると、React で ES6+ を使用する正しい方法は、次のようにコンポーネントを初期化することです。
class Video extends React.Component {
static defaultProps = {
autoPlay: false,
maxLoops: 10,
}
static propTypes = {
autoPlay: React.PropTypes.bool.isRequired,
maxLoops: React.PropTypes.number.isRequired,
posterFrameSrc: React.PropTypes.string.isRequired,
videoSrc: React.PropTypes.string.isRequired,
}
state = {
loopsRemaining: this.props.maxLoops,
}
}
ただし、Dan Abramov 自身のReact DnDモジュールなど、いくつかの公式の例では、ES6+ を使用していますが、コンストラクター内で状態を定義しています。
constructor(props) {
super(props);
this.moveCard = this.moveCard.bind(this);
this.state = {
// state stuff
}
}
現在、React の重要な貢献者である Dan Abramov は、コンストラクターの外部で状態を定義できることをおそらく知っていますが、コンストラクター内でそれを行うことを選択しています。
だから私は、どの方法がより良いのか、そしてその理由は何なのか疑問に思っています。