检查反应输入表格的小数点并更改值

Question

在我当前的 React 应用程序中，我需要一个根据以下规则验证和更改结果的输入：

Input: 10 -> Output: 1000
Input: 10.5 -> Output: 1050
Input: 10.55 -> Output: 1055

这是我目前拥有的：

<Form.Control
    as="input"
    type="number"
    min="0.00"
    step=".01"
    onChange={this.handleChange.bind(this)}
/>

handleChange(event: React.ChangeEvent<HTMLInputElement>) {
    if(event.target.value.includes('.')) {
        let values = event.target.value.split('.')
        if(values[1].length <= 1) {
            let decimal = values[1] = values[1] + '0';
            let output = values[0] + decimal;
        }
    }
    this.submitPayment(output) // error: output not defined
}

我现在的问题是我的代码只有在输入小数点 (point/comma) 时才有效。

此外，我想还有更多 "elegant" 解决方案，如果知道的话会很棒！

Answer 1

我不明白你为什么不这样做：

handleChange(event: React.ChangeEvent<HTMLInputElement>) {
    const output = parseFloat(event.target.value) * 100
    this.submitPayment(output);
}

检查反应输入表格的小数点并更改值

Check react input form for decimals and change value

javascript

numbers

input

decimal

reactjs