为什么输入值中设置的值仅属于字符串类型？答案

【问题标题】：Why is value set in input value is of type string only?为什么输入值中设置的值仅属于字符串类型？
【发布时间】：2019-03-20 06:53:44
【问题描述】：

在这里，我想在我的 reactjs 组件中将 setstate 中的值设置为整数。我无法这样做，因为该值未设置为整数，因此在单选按钮中它没有被选中。

constructor(props) {
  super(props);
  this.state = {
   frequency: 1,
}
handleSelectChange(event) {

  this.setState({
    frequency: event.target.value
  })
};


<div className = "custom-control custom-radio custom-control-inline"
onChange = {
    this.handleSelectChange.bind(this)
  } >
  <
  input type = "radio"
id = "oneTime"
value = "0"
name = "type"
onChange = {
  event => this.handleSelectChange(event)
}

checked = {
  this.state.frequency === "0"
}
className = "custom-control-input" / >
  <
  label className = "custom-control-label"
htmlFor = "oneTime" > {
    Labels.PRODUCT_SUBSCRIPTION.ONETIME
  } <
  /label> < /
div > <
  div className = "custom-control custom-radio custom-control-inline" >
  <
  input type = "radio"
id = "continuous"
value = "1"
name = "type"
checked = {
  this.state.frequency === "1"
}
onChange = {
  event => this.handleSelectChange(event)
}
className = "custom-control-input" / >
  <
  label className = "custom-control-label"
htmlFor = "continuous" > {
    Labels.PRODUCT_SUBSCRIPTION.CONTINUOUS
  } 
  </label>
  </div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>

我知道我们可以使用 defaultValue 来设置它。但随后它变得不受控制，这是不被鼓励的。

【问题讨论】：

标签： javascript reactjs

【解决方案1】：

而不是像字符串一样设置值

<input type="radio" value="1" />

设置为整数

<input type="radio" value={1} />

如果您希望您的状态的某些值是严格的数字，请在比较时尝试使用===，否则您的比较不会很严格

编辑

要选中单选按钮，您可以通过将单选按钮与 state 的值进行比较来设置单选按钮的 checked attr

<input type="radio" checked={this.state.frequency === 1} value={1} />

【讨论】：

我之前试过了，但是当我点击单选按钮时没有被选中。
它不会根据值进行检查，而是根据已检查的属性进行检查，让我编辑我的答案

【解决方案2】：

你应该像这样初始化值：

<input type="radio"
 checked={this.state.frequency === 1}
 value={this.state.frequency || 0} />

您已经从另一个答案中注意到value="0" 将代表字符串0，而value={0} 将代表整数0。

【讨论】：