React JSX中的迭代

Question

我在React jsx中迭代时遇到问题。

我想让代码变成

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

但我在"value={（this.props.message.text1）}"部分的编码上遇到了问题。

我想做一些类似的事情

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

下面是我的代码；

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

使用squarebracket访问器表示法value={this.props.message[key]}