Reactチュートリアルをやっていってみるその16
これは
Reactチュートリアルをやっていく記事です。
参考
タイムトラベル機能の追加
タイムトラベルの実装
keyの説明でもあったように、配列に登録された操作履歴にはidが振られています。
Gameコンポーネント内のrenderメソッドにkeyを追加してwarningを消します。
gyazo.com
jumpToメソッドが未定義なので作成していきます。
stepNumberとしてstateの初期値をセットします。
gyazo.com
jumpToを追加します。
gyazo.com
クリックされた時の動作にstepNumberを追加するよう修正をします。
gyazo.com
GameコンポーネントのrenderをstepNumberになるよう修正する。
gyazo.com
実行してみると、ちゃんと操作を戻せるようになっています。
また、新たに変更した操作にうわがいてゲームを進行できるようになっています。
今日はここまで。
