Wie in einzelnen Wert innerhalb spezifischem Array-Elements aktualisieren redux

Question

ich ein Problem habe, wo erneutes Rendern von Staat ui Themen verursacht und vorgeschlagen wurde, nur bestimmten Wert in meinem Minderer aktualisieren Menge des Re-Rendering auf einer Seite zu reduzieren.

ist dieses Beispiel meines Staates

{ 
name: "some name", 
subtitle: "some subtitle", 
contents: [ 
    {title: "some title", text: "some text"}, 
    {title: "some other title", text: "some other text"} 
] 
} 

und ich bin zur Aktualisierung es wie dieses

case 'SOME_ACTION': 
    return { ...state, contents: action.payload } 

wo action.payload ist eine ganze Reihe neuer Werte enthält. Aber jetzt brauche ich eigentlich nur Text des zweiten Elements aktualisieren in Inhalt Array, und so etwas wie dies funktioniert nicht

case 'SOME_ACTION': 
    return { ...state, contents[1].text: action.payload } 

wo action.payload ist nun ein Text, den ich für die Aktualisierung benötigen.

Answer 1

Sie könnten Obwohl ich Sie wahrscheinlich etwas mehr wie dies tun würde denken würde?

case 'SOME_ACTION': 
    return update(state, { 
    contents: { 
     [action.id]: { 
     text: {$set: action.payload} 
     } 
    } 
    }); 

Answer 2

Sie müssen nicht alles tun, was in einer Zeile: die React Immutability helpers

import update from 'react-addons-update'; 

// ...  

case 'SOME_ACTION': 
    return update(state, { 
    contents: { 
     1: { 
     text: {$set: action.payload} 
     } 
    } 
    }); 

verwenden

case 'SOME_ACTION': 
    const newState = { ...state }; 
    newState.contents = 
    [ 
     newState.contents[0], 
     {title: newState.contnets[1].title, text: action.payload} 
    ]; 
    return newState 

Answer 3

können Sie map verwenden. Hier ist eine Beispiel-Implementierung:

case 'SOME_ACTION': 
    return { 
     ...state, 
     contents: state.contents.map(
      (content, i) => i === 1 ? {...content, text: action.payload} 
            : content 
     ) 
    }