React.jsをES6で書き直した

Facebook にシェア
Pocket
LINEで送る
このエントリーを Google ブックマーク に追加

React.jsのコード例を自分用にまとめてみる(JSX)のまとめのコードをES6に書き換えてみた。

いくつか注意しないといけない点があった。

classの作成方法

React.jsのクラスの作り方は、React.createClass関数を使っていた。

これを React.Componentクラスをextendsすることでクラスを作成する。

 

propsの使い方

React.jsの場合、propsはthis.props.hogeで呼び出せたが、ES6で書く場合はconstructorで呼び出す必要がある。

 

stateの使い方

React.jsの場合、stateはgetInitialState関数で作成した。

ES6の場合は、constructorでstateを定義する。

一方、stateの変更はReact.jsと同じく、setState関数を使う。

 

まとめを書き直してみる。

React.jsのコード例を自分用にまとめてみる(JSX)のまとめのコードをES6に書き換えてみた。

 

 

 

 

 

 

 

 

 

 

 

こっちのほうがわかりやすいかな(主観)

Follow me!

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です