为什么我们需要将e.target.name放在方括号[]中?

为什么在使用表单元素时必须将e.arget.name放在方括号中?

这是我的代码:

onChange (e) {

this.setState({ *[e.target.name]* : e.target.value});

}

(...)

<div>

<label htmlFor=""> Title : </label>

<input type="text" name="title" onChange={this.onChange} value={this.state.title} />

</div>

</form>

回答:

这是为了动态更新对象属性(当属性的名称预先未知但运行时时)。这样,您可以使多个React输入具有不同的name属性,并使用相同的onChange处理程序来更新部分状态。

与此相关。

代替这个:

<input type="text" name="title" onChange={this.onTitleChange} value={this.state.title} />

<input type="text" name="address" onChange={this.onDescriptionChange} value={this.state.address} />

<input type="text" name="description" onChange={this.onAddressChange} value={this.state.description} />

onTitleChange (e) {

this.setState({ title : e.target.value});

}

onAddressChange (e) {

this.setState({ address : e.target.value});

}

onDescriptionChange (e) {

this.setState({ description : e.target.value});

}

我们只能编写一个像您介绍的处理程序:

<input type="text" name="title" onChange={this.onChange} value={this.state.title} />

<input type="text" name="address" onChange={this.onChange} value={this.state.address} />

<input type="text" name="description" onChange={this.onChange} value={this.state.description} />

onChange (e) {

this.setState({ [e.target.name] : e.target.value});

}

以上是 为什么我们需要将e.target.name放在方括号[]中? 的全部内容, 来源链接: utcz.com/qa/422791.html

回到顶部