Elsaの技術日記(徒然なるままに)

主に自分で作ったアプリとかの報告・日記を記載

MENU

React ワニたたき作成 ~part2~

やっと、ワニたたきがまともに動く形になりました!!
PC版しか対応できていないけど、、、


アプリ作成時に非同期処理についてちょっと詰まってしまったため合わせて書いておきたいと思います!!

■アプリ紹介

最終的にこんな感じになりました!!
f:id:Elsammit:20200810161619g:plain



アプリはこちらに公開しました。
ワニたたきゲーム



遊び方としてはヒットポイントが0になるまでに何体のワニを叩けたか?というゲームになります!!

■アロー関数を用いた非同期処理

非同期処理を行う上でPromise、thenを用いるのですが、アロー関数でも使えるのかな?と思い確認しました。
結果、アロー関数でもPromise、thenが使えたので、そこを備忘録として残しておきたいと思います。


といっても、関数として定義している部分をアロー関数に置き換えればOKです。
こんな感じになります。

TestObjA = () =>{
    return new Promise((resolve, reject) =>{
		// 処理を書く.
        resolve("返り値");
    })
}

this.TestObjA().then( () =>{
    //TestObjA実行後に実行したい処理を書く.
})

SetStateで変数に値をセットすると、非同期処理になって動くため、
変数セットした後にその値を用いたい、なんて場合には考えて処理をしないといけないので、これから重宝する気がします。

■最後に

今年のお盆はGWと同様にStay Homeになってしまいそうです。。。
帰省とか友人たちとBBQの予定とか、色々考えていたのですが泣。


残念ではありますが、切り替えてアプリを作ったり勉強を進めたりブログ書いたりしていきます!!
後、基本情報技術者試験の勉強も頑張っていきます。