質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Redux

Reduxは、JavaScriptアプリケーションの状態を管理するためのオープンソースライブラリです。ReactやAngularで一般的にユーザーインターフェイスの構築に利用されます。

Q&A

解決済

1回答

2119閲覧

Reduxのstate構造について

rtamura

総合スコア34

Redux

Reduxは、JavaScriptアプリケーションの状態を管理するためのオープンソースライブラリです。ReactやAngularで一般的にユーザーインターフェイスの構築に利用されます。

1グッド

1クリップ

投稿2017/03/25 16:41

前提・実現したいこと

React+Reduxの勉強でtrelloのようなTODOアプリを作成しています。
TODOアプリにはtrelloの形式のような構成にしていて、以下の3つの概念が登場します。

Board: TODOの一番大きな分類。 プロジェクト単位くらい

Lane: 1つのBoard内にある、複数のTODOをまとめた単位。"これからすること", "いましていること", "終わったこと"など、Board内のTODOを状態でまとめたりする。1つのBoardに複数のLaneが存在する。

Card: TODOの最小作業単位。1つのLaneに複数のCardが存在する。

発生している問題

現在のStateの構造が適切な構造であるかがわからず、悩んでいる。

現在は、公式解説を参考にして、Stateを正規化された構造にしておりますが、

javascript

1{ 2 boards: { 3 byId: { 4 1: { 5 // Boardタイトル 6 title: "ボード1" 7 // Board1内に存在するLane IDリスト 8 lanes: [10, 20] 9 } 10 2: { 11 title: "ボード2" 12 lanes: [30, 40, 50] 13 } 14 } 15 // 全てのLaneIDリスト 16 allIds: [1, 2] 17 }, 18 lanes: { 19 byId: { 20 10: { 21 // Lane10内に存在するLane IDリスト 22 cards: [100, 200] 23 } 24 20: { 25 cards: [300, 400, 500] 26 } 27 30: { 28 cards: [ /* 略 */ ] 29 } 30 40: { 31 cards: [/* 略 */] 32 } 33 } 34 // 全てのLaneIDリスト 35 allIds: [10, 20, 30, 40, 50] 36 } 37 cards: { 38 byId: { 39 100: { 40 // TODO内容のテキスト 41 text: "TODO1" 42 } 43 200: { 44 text: "TODO2" 45 } 46 300: { 47 text: "TODO3" 48 } 49 /* 略 */ 50 } 51 // 全てのLaneIDリスト 52 allIds: [100, 200, 300, 400, 500, ...] 53 } 54}

上記の構造は、きちんと公式解説に従ったものとなっているでしょうか。

DrqYuto👍を押しています

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

構造について変だと思う点はありませんでした。

関係ないかもしれませんが、ID の振り方が気になりました。
(board は lane は 10 * n, card は 100 * n となっている点です)

byId 以下の key は全体で一意にする必要はないので、それぞれの model がもつ連番(や取得したID)で構わないです。
API などで取得したデータを normalize して個々のレコードについてきた ID で byID の State に更新します。

(説明上あえてそうしているのであればすいません)

投稿2017/10/25 19:38

anozon

総合スコア662

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

rtamura

2018/03/03 08:13

超遅くなりました、すみません! 構造について、ご回答ありがとうございます。間違ったことをしていなくてよかったです。 IDの振り方につては1年くらい前の投稿で、どうしてこういう風にしたかはちょっと忘れてしまいましたが、特に全体で一意にとしようとは考えたいなかったと思います。(たぶん) elzupさんのおっしゃる通り、各model内で一意になるようにして作っていきたいと思います。 ご回答・ご指摘ありがとうございました!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問