Reactガイドを読んでいくその243
これは
Reactのガイドを読んでいく記事です。
ガイドのリンク
ステートフックの利用法
クラスによる同等の例
フックでできることをクラスでやった場合の例
class Example extends React.Component { constructor(props) { super(props); this.state = { count: 0 }; } render() { return ( <div> <p>You clicked {this.state.count} times</p> <button onClick={() => this.setState({ count: this.state.count + 1 })}> Click me </button> </div> ); } }
フック以前ではポピュラーなコード。
stateは count 0から始まってユーザがボタンをクリックしたときにthis.setState()を呼ぶことでカウントをインクリメントするようになっている。
明日からはフックと関数コンポーネントを見ていきながらステートフックへの理解を深めていく。
今日はここまで