Question

我有一组使用以下方法设置的单选按钮。在handleChange点，如果目标元素是单选按钮，我将值转换为整数。

在初始handleChange上，typeof返回一个数字但是后续调用将状态作为字符串返回。

我对TypeScript的理解是语言是强类型的，所以不应该以这种方式进行转换？

<input id="EvalLikelihood_1" name="EvalLikelihood" type="radio" value="1" checked={this.state.EvalLikelihood == 1} onChange={this.handleChange}/>

private handleChange(event): void { 
      const target = event.target;
      console.log(parseInt(target.value));
        const value = target.type === 'radio' ? target.value : parseInt(target.value);
        const name = target.name;
        this.setState({
          [name]: value
        });
        console.log(typeof this.state.EvalLikelihood)
        console.log(this.state.EvalLikelihood)
      }
this.state = {
      EvalLikelihood: 0,
      safety: 0,
      security: 0,
      enviroment: 0,
      finance: 0,
      operational: 0,
      legal: 0,
      reputation: 0,
      inherentRisk: 0
    };

EvalLikelihood: number;

感谢您查看此问题。

Answer 1

三元运算符行的问题。

const value = target.type === 'radio' ? target.value : parseInt(target.value);

在这里，您可以查看target.type，如果它是radio，则会返回当前值，即字符串。在这种情况下，您不需要ternary operator，因为您的input类型为radio，因此您只需将字符串值转换为number。

解决方案很简单：将上面的行替换为：

const value = parseInt(target.value, 10)

Worked example

Answer 2

Typescript只是JavaScript的超集，而不是另一种语言。编译时生成常规javascript。我不知道为什么它第一次为你工作。尝试将代码更改为：

const value = typeof target.type === 'number' ? target.value : parseInt(target.value);

使用parseInt转换单选按钮会返回一个字符串

2 个答案: