Freeお知らせ一覧

React でお知らせ一覧を完成させる問題です。各お知らせはタイトルをクリックすると詳細が 開き(行ごとに状態を持ちます)、削除もでき、何度操作しても各行の状態が正しいお知らせに 保たれる必要があります。行コンポーネントは提供されるのでそのまま使い、 インメモリのお知らせデータをレンダリングします。

一覧画面は同じ形の行をデータの数だけ繰り返し描画しますが、各行が自分の状態(開いているか など)を持つと扱いが難しくなります。この問題は、一覧が開く・削除で変化しても、各行の状態が 別のお知らせへ移らず正しいお知らせに付いたままになるようにすることが主題です。React で 一覧を描くときは、項目をどう識別するかが更新の動作に影響します。一度の操作だけでなく、 開く・削除を混ぜて何度も操作したあとも各行の状態が正しいかを検証する習慣が重要です。

React で一覧はどう描画しますか？

データの配列をたどり、同じ形の行を繰り返し描画します。この問題は提供された行コンポーネントをそのまま使いながら、一覧全体を描き、開く・削除を扱うことです。

一覧の行ごとに状態があるとき、何を検証すべきですか？

一度の操作だけを見ず、開く・削除を混ぜて何度も操作したあとも、各行の状態が正しいお知らせに保たれているかを確認します。

行コンポーネントは自分で作る必要がありますか？

いいえ。行コンポーネントは提供され、そのまま使います(変更しません)。完成させる対象は一覧全体を描く一覧コンポーネントです。