只有数字。在React中输入数字
我试图模仿您的代码,并发现 with <input type='number' />
。有关解决方法,请检查此示例并自己尝试:https ://codepen.io/zvona/pen/WjpKJX?editors=0010
您只需使用数字模式将其定义为普通输入(type =’text’):
<input type="text" pattern="[0-9]*"
onInput={this.handleChange.bind(this)} value={this.state.financialGoal} />
然后比较输入的有效性:
const financialGoal = (evt.target.validity.valid) ?
evt.target.value : this.state.financialGoal;
这种方法最大的警告是涉及移动->键盘不是数字形式而是普通字母形式。
我试图从输入中排除减号和加号,但这是错误的:
handleChange(event) {
const value = event.target.value.replace(/\+|-/ig,'');
this.setState({financialGoal: value});
}
渲染输入代码:
<input style={{width: '150px'}} type="number" value={this.state.financialGoal} onChange={this.handleChange}/>
你可能想看: