反应输入：在输入为空的情况下添加值答案

【问题标题】：React inputs: adding value in case of empty input反应输入：在输入为空的情况下添加值
【发布时间】：2020-04-06 11:18:14
【问题描述】：

在此示例中，如果另一个组件的状态设置为 true，则会出现此输入。输入的值来自该组件的状态 score4: ""，它作为 props newScore4 传递。但是，如果输入没有出现并且没有写入任何内容，则该值未设置为整数，并且当我添加所有分数时，我得到的结果是 NaN。如果输入为空，有没有办法将值设置为 0？

<input id="score4" type="number" min="0" max="10" name="score4" style={this.props.addJudges ? none : display} value={this.props.newScore4} onChange={this.props.handleInputChange} />

handleInputChange = (e) => {
        this.setState({...this.state,
        [e.target.name]: e.target.value})
      };

【问题讨论】：

[e.target.name]: e.target.value || 0 工作吗？

标签： reactjs input

【解决方案1】：

你可以使用三元运算符，检查this.props.newScore4是否为空，如果它分配了一个值0，如果它不为空，只需分配this.props.newScore4

<input id="score4" type="number" min="0" max="10" name="score4" style={this.props.addJudges ? none : display} value={this.props.newScore4===''?0:this.props.newScore4} onChange={this.props.handleInputChange} />

【讨论】：