Redux状態：アクションまたはセレクタ？

Question

状態は、以下のように数字の配列（+ 0）をランダムに生成する関数によって水和されます。

[[3,0]、[6,0]、[8,0]、[2、0 ] .....]

これは現時点でのアプリの状態です。 [3、0]は数字3を含み、見えない（0）タイルの例です。タイルをクリックすると、アクションを送出し、対応する要素の0が1に変わり、それに基づいてタイルが数字（3）

したがって、最初のタイルをクリックすると、状態は [[3,1]、[6,0]、[8,0]、[2、0] ..に変更されます。 ...]

は今、私は次のように追加する：

• すること（すなわち第二の要素として1秒を持っている。）明らかにされているどのように多くのタイルを追跡いつでも。

• 限度2に覆われていないタイルの数（第二タイルの数は最初のものと一致しない場合、両方が再びカバーされます - 多くのメモリゲームは同様の機能を持っている）

• 私は1枚のタイルを明らか場合は、その後、 2番目と数字が一致すると、私はそれらを永久に明らかにしておきたい、そしてスコアに+1を加える。

メイン州の別の部分として設計する必要がありますか（別のレデューサーを使用してからリデューサーを組み合わせます）？または私は次のようにそれを含めるように状態の最初の部分を再設計する必要があります

initialState = { 
    grid: [[3,0], [4,0],...], 
    score: 0, 
    number_of_uncovered_tiles: 0 
} 

今スコアとnumber_of_uncovered_tilesの値を変更するために - 私は両方がちょうどになるように、私はアクションが、セレクタを使用してはならないことを修正していますグリッド配列の要素の値の状態に基づいて自動的に計算されますか？

Answer 1

一般的に、1つの減速機で操作される深くネストされた階層を避けて、できるだけ平らな状態を保つことをお勧めします。

あなたの場合は、gridレデューサーとuncoveredTilesレデューサーを分割します。これにより、タイルの配列を何度も何度も繰り返し実行する必要なしに、タイルを開くことをよりよく制御できます。

{ 
    grid: [ 3, 4, 9, ...], 
    score: 0, 
    uncoveredTiles: [ 0, 2 ], 
} 

この方法で決算タイルを2が開いているだけの問題grid[uncoveredTiles[0]]とgrid[uncoveredTiles[1]]を更新し[]にuncoveredTilesをresetingのです。

タイルデータが複雑になる場合（たとえば、画像で数値を入れ替える場合）、gridレデューサーのみを変更する必要がありますが、uncoveredTilesは同じままです。

また、私はscoresのための別の減速機を導入することを考えています。