#27 React でプロプラ！ Vol.3 「BlackJack」：最初に配られたハンドがブラックジャックかどうかを判定する①

「React.js でプログラミング・プラモデル」の連載第３弾。
React.js で、カジノゲーム「BlackJack」を作ろう！

これまで

前回は、カードが Ace であるか、フェイスカードであるかを判定しました。

現時点の Sandbox

前回までの Sandbox はこちら。
はじめての方は、ここから一緒に作り始めることができます。

BlackJack #26 - CodeSandbox

今回のゴール

・カードが 2枚ずつ配られたら、reducer() のブラックジャック判定処理にディスパッチする

今回の設計書

src/BlackJack.js

BlackJack コンポーネント
// コメントで「ブラックジャックかどうかをチェック」
// と書かれている useEffect() を見つけてください
-----
1. state.dealersHand.length と state.playersHand.length がともに 2 のとき
 1.1 reducer() に以下のオブジェクトを引数で渡してディスパッチする
     { type: "checkBlackJack" }
2. useEffect() の第二引数の配列に以下の値を設定する
 - state.dealersHand
 - state.playersHand

ヒント

・reducer() にディスパッチする処理は過去記事を参考にしてね！

実装例

BlackJack #27 - CodeSandbox

カードを配り終えた後にディスパッチできましたか？
動作確認する場合は、reducer() の case "checkBlackJack" 内でコンソール出力してみましょう！

"checkBlackJack now!" が 1行だけ出力されていればオッケーです！

case "checkBlackJack": {
 console.log("checkBlackJack now!");
 return { ...state };
}

次回

次回は、ディスパッチされた後の処理を実装します！