React ajouter une propriété à l'objet immuable

Question

J'essaie d'ajouter une nouvelle propriété aux objets dans un tableau. Mon idée était de faire quelque chose comme ceci:

class Foo extends Component { 
    constructor(props) { 
     super(props); 

     this.state = this.getInitialState(); 
     console.log(this.state); //Property "label" is missing in "members" array 
    } 

    /** 
    * Get initial state 
    * @returns {{title, description}} 
    */ 
    getInitialState =() => { 
     let members = this.props.members.slice(); 
     members.map((member) => { 
      return { 
       ...member, 
       label: (member.firstName + " " + member.lastName) 
      } 
     }); 
     console.log(members); //"label" is not a property of objects 

     return {title: "", description: "", responsible: [], typeOf: null, 
       members: members}; 
    }; 

    render() { 
     return (<div/>) 
    } 
} 

Je veux members de rester/rester immuable, mais l'ajout d'une autre propriété à chaque objet dans ce tableau. Qu'est-ce que je fais mal ici? Merci!

Answer 1

Vous n'êtes pas stocker retourné valeur de carte aux membres variables

getInitialState =() => { 
     let members = this.props.members.map((member) => { 
      return { 
       ...member, 
       label: (member.firstName + " " + member.lastName) 
      } 
     }); 
     console.log(members); //"label" is not a property of objects 

     return {title: "", description: "", responsible: [], typeOf: null, 
       members: members}; 
    }; 

Answer 2

Le prototype de tableau .map() ne mute pas le tableau original, mais retourne un nouveau tableau.