Iterating in React JSX

Question

Ich habe ein Problem beim Reagieren jsx.

ich den Code machen wollen gehen

value={('this.props.message.text1)} 
    value={('this.props.message.text2)} 

Aber ich habe Probleme mit der Codierung im "value = {('this.props.message.text1)}" teil.

ich wie

etwas tun wollen

value={('this.props.message.' + key)} 

Unten ist mein Code;

constructor(){ 
    super(); 
    this.state = { 
    message: { 
     text1: "hello1", 
     text2: "hello2" 
    } 
    } 
} 

renderMessage(key){ 
    return (
     <div className="fish-edit" key={key}> 
     <input 
     type="text" 
     value={('this.props.message.' + key)} 
     onChange={this.props.handleChange} 
     /> 
     </div> 
    ) 
    } 

render() { 
    return (
    <div> 
     {Object.keys(this.props.message).map(this.renderMessage)} 
    </div> 
    ) 
} 
}; 

Answer 1

die squarebracket Accessor Notation, value={this.props.message[key]}