リストの選択項目をReduxに格納するパターン

Question

TodoのタスクをReact-Reduxで選択できるようにしたいとします。 この状態はどこに保存する必要がありますか？

まずソリューション：タスク

第二の溶液にisActive: true attributを追加します。ただ、選択した項目のIDを処理する新しい減速を作成します。

私は両方のソリューションが嫌いです：最初の1つは、その中にタスクに無関係なものを格納しているように感じ、2番目のIDはIDを格納するために全体の減速装置を作成するために過度に感じます。

他にもオプションはありますか？何がベストですか？ ありがとう

Answer 1

私はあなたのユースケースによって異なると言います。持続するUI状態のトンを持っている大きなアプリを

1. は、それは多くの意味がUIに関連する店舗のスライスを変異させるために特別な減速を持つようになります。

2. 複数のタスクを同時にアクティブにすることができる場合は、タスクごとにisActive: booleanプロパティが有効であることが有効です。タスクデータの観点からはタスクに関係していませんが、実際にはアプリケーションの観点から見ています。あなたのreduxストアの主な目標は、APIデータモデルをミラーリングするのではなく、アプリケーションの真実のソースになることです。

3. 単一のタスクしかアクティブ/選択していない場合は、isActive: idとすることもできます。

4. コンポーネントの状態を使用することもできます。これの限界は、それが持続しないことと共有されないことです。たとえば、保存ボタンを使用する場合、そのボタンは選択された状態のコンポーネント内になければなりません。

Answer 2

表示されている2つのオプションのどちらも間違っていることはありません。しかし、あなたは他のオプションを探しているなら、あなたは ）は、ドスの減速状態で選択した項目を含めることができますので、あなたの状態オブジェクトは、次のようになります。

{ 
    selected: id, 
    list: [{id, text, completed}, ...] 
} 

2）ドン君場合選択したアイテムがアプリの他の場所に必要な場合は、ローカルの状態で保存するだけです。 Reduxのアプリケーション状態とローカル状態の両方を、コンポーネント内にのみ含まれているデータと混在させても問題ありません。