質問編集履歴

1

具体的な使用例を記入

2022/04/26 06:51

投稿

JK_Taro
JK_Taro

スコア20

test CHANGED
File without changes
test CHANGED
@@ -1,8 +1,8 @@
1
1
  例として、作成したいデータ形式としては、仮に通常のオブジェクト形式であれば下のようなものです。
2
2
 
3
- let object = {
3
+ let allReplyObject = {
4
- documentId1_Key: [{object1: 'text' }, {object2: 'text'} ],
4
+ postDocumentId1_Key: [{reply: 'text' }, {reply: 'text'} ],
5
- documentId2_key: [{object3: 'text' }, {object4: 'text'} ]
5
+ postDocumentId2_key: [{reply: 'text' }, {reply: 'text'} ]
6
6
  }
7
7
 
8
8
 
@@ -16,10 +16,13 @@
16
16
  一方で、このような形式のオブジェクトをReactのuseStateのデータ形式で使う場合、正しい操作がいまいちわかりません。 
17
17
 
18
18
  やりたい操作は例えば、
19
- 1、主オブジェクトに新たなdocumentId_Key : [配列] データの追加、
19
+ 1、主オブジェクトに新たなpostDocumentId_Key : [配列] データの追加、
20
20
  2、指定のドキュメントIdの配列内に更なるオブジェクトの追加、もしくは配列ないの特定のオブジェクトを削除
21
21
  3、指定のドキュメントIdの配列内のオブジェクトデータを順番に取り出し(key:value の値から表示内容を作成)
22
+ 4、所望のpostDocumentId_Keyが(作成される前)ない場合のエラーにならないような適切な判定処理
22
23
 
23
24
  これらの操作方法を教えていただけたら助かります。
24
25
  メリットとしては、目的のドキュメントIdを元に一発で関連する複数のオブジェクトを配列として取り出せることなんですが、そもそも論、useStateで同じことをするのに別のもっと良い(他のデータ形式)アプローチがありましたら、そちらの別アプローチのご教授でもかまいません。
25
26
  よろしくお願いします。
27
+
28
+ この構造を使う具体例としては、掲示板の投稿ポストをクリックし、ページでスクロールした分だけの投稿に対する返信がサーバーから順番に読み込まれ、投稿ID(key)に一致する配列に読み込まれた分だけの返信オブジェクトが配列に挿入されていくというものです。(1返信が配列内の1オブジェクトになります)返信を取得する動作をした場合のみ 投稿ID:[返信オブジェクト配列] の構造が主オブジェクト内に作成され、スクロールを止めるまで返信オブジェクトが取得され配列順に入れられて行きます。