我的 React 组件中有一些代码:
<legend>Data:</legend>
<Input type="text" name="Payment" id="Payment" className="validate[required, custom[integer], max[9999999999999]]" placeholder="2000" addonBefore="Payment" addonAfter="cents" />
<Input type="text" name="Value" id="Value" className="validate[required, custom[integer], max[9999999999999]]" placeholder="3500" addonBefore="Value" addonAfter="cents" />
<Input type="select" label="Some code" placeholder="placeholder" >
<option value="0">option1</option>
<option value="1">option2</option>
<option value="2">option3</option>
</Input>
<Input type="select" label="Some category" placeholder="Category">
<option value="0">category1</option>
<option value="1">category2</option>
<option value="2">category3</option>
<option value="3">Category4</option>
<option value="4">Category5</option>
</Input>
<Input type="select" label="Another code" placeholder="some code">
<option value="1">code1</option>
<option value="2">code2</option>
<option value="3">code3</option>
<option value="4">code4</option>
<option value="5">code5</option>
<option value="8">code6</option>
<option value="7">code7</option>
</Input>
</fieldset>
如果输入付款不为空,我如何更改“某些类别”中的选择选项?我的意思是,如果用户在“付款”输入中输入一些文本(例如),则必须将选择选项从默认更改为第二或第三。还有类似的另一个文本输入和选择选项?我怎样才能做到这一点?
最佳答案
您必须进行所有输入 - controlled
将输入值保存到组件的 state
中,并根据这些值执行呈现不同 options
<select value={this.state.myValue} onChange={this.handleChange}>
<option value="A">Apple</option>
<option value="B">Banana</option>
<option value="C">Cranberry</option>
</select>
您需要使用 value
属性而不是 defaultValue
来进行选择 - controlled
在 docs 中阅读更多内容
关于javascript - 如果在 react js 中输入不为空,请选择另一个选项,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38970379/