Question

这是我的代码。每当我在一个输入框上触发onFocus时，另一个输入框也会更改其输入类型。我只希望特定的框在对焦时更改类型。

this.state = {type: 'text'};
   onFocus() {this.setState({ type: 'time'});}
   onBlur() {this.setState({type: 'text'});}

<Form.Control type={this.state.type} onFocus={()=>this.onFocus()} onBlur={()=>this.onBlur()} placeholder="Shop opens" />

<Form.Control placeholder="Shop closes" type={this.state.type} onFocus={()=>this.onFocus()} onBlur={()=>this.onBlur()} />

Answer 1

这是因为两个输入只使用一个状态属性。

您可以存储当前的焦点输入，而不是存储type。

未经测试的代码，但是您可以执行以下操作：

this.state = {focused: null};
   onFocus(inputName) {this.setState({ focused: inputName });}
   onBlur() {this.setState({ focused: null });}

<Form.Control type={this.state.focused === 'opens' ? 'time' : 'text'} onFocus={()=>this.onFocus('opens')} onBlur={()=>this.onBlur()} placeholder="Shop opens" />

<Form.Control placeholder="Shop closes" type={this.state.focused === 'closes' ? 'time' : 'text'} onFocus={()=>this.onFocus('closes')} onBlur={()=>this.onBlur()} />

如何传递event.target值？

1 个答案: