我有一个简单的onChange,它接受用户的输入pareses并设置要渲染的状态.这是代码.
import React,{ Component } from 'react'; import './App.css'; class App extends Component { constructor() { super(); this.state = { random: { foo: 0 } } } onChange(e) { let random = this.state.random; random[e.target.name] = parseFloat(e.target.value); this.setState({random}); } render() { return ( <div className="App"> <input onChange={this.onChange.bind(this)} type="text" name="foo" value={this.state.random.foo} /> </div> ); } } export default App;
我不明白的是我的小数点在哪里.我知道没有任何验证可以阻止用户输入字母,但这只是一个示例应用程序来测试我遇到的这个问题.当我输入小数点时,不会被渲染.我哪里错了?
解决方法
问题是React的onChange行为与浏览器的onChange不同,它的行为与onInput类似,因此每次键入值时都会调用它.这导致你的parseFloat实际解析1.而不是1.2而解析的值为1是1