无需提交表单或输入 ReactJs 即可获取选项值答案

【问题标题】：Get value of option without submit form or input ReactJs无需提交表单或输入 ReactJs 即可获取选项值
【发布时间】：2019-03-27 15:23:53
【问题描述】：

我有一个带有选项的选择，并且想在不提交表单或使用按钮或输入的情况下获取选项的值。例如，如果我选择 USD 我希望函数返回 USD，对于 EUR，应返回 EUR

 <select value={this.state.value} onChange={this.handleChange}>
      <option value="EUR">EUR</option>
      <option value="USD">USD</option>
      <option value="RUR">RUR</option>
      <option value="GBP">GBP</option>
  </select>

【问题讨论】：

你能多写一点关于你的目标吗？
我想做一个货币计算器，当我在下面的输入中更改货币时，应该会显示转换后的值。这就是为什么我不需要提交表单的按钮

标签： javascript reactjs

【解决方案1】：

<select value={this.state.value} onChange={this.handleChange}>
    <option value="EUR">EUR</option>
    <option value="USD">USD</option>
    <option value="RUR">RUR</option>
    <option value="GBP">GBP</option>
</select>

您可以像这样访问handleChange 中的选定值：

handleChange(e) {
    console.log(e.target.value); // for ex. will print USD
}

【讨论】：

【解决方案2】：

创建一个函数displayUsd()然后在select元素的onChange事件中使用 this.displayUsd.

【讨论】：

【解决方案3】：

你可以在onChange={this.handleChange}做这样的事情

 handleChange = (e) => {
  // e.target.value will USD 
 }

或

 handleChange: function(event){
     // event.target.value
 }

【讨论】：

【解决方案4】：

假设你在这里使用了一个类并扩展了 react。

constructor() {
    this.state = { value: 'default Value' }
}

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

【讨论】：