我希望用户能够输入最多2000的数字,超过2000的任何内容都会被简单地反馈到输入中作为'2000'。
<input type="number" className="no-spin"
min="0" max="2000"
value={???}
{...eval(`${meal}_salt_amt_1`)} />
BTW,'max'属性仅阻止用户使用向上箭头增加到2000以上。
而redux-form的'validate'功能并不限制可输入的内容。
以下是我如何将值(状态)限制为2000 ...
export function updateStats(values) {
for (var value in values){
if (value.search('salt_amt') >= 0) {
if ( values[value] > 2000) values[value] = 2000;
}
}
return {
type: UPDATE_STATS,
stats: JSON.parse(JSON.stringify(values))
};
}
...到目前为止一切顺利,因为在我的DevTools redux插件中,我可以看到这些值的状态在2000年达到顶峰。
但是如何将该状态强制回到我的redux-form输入字段?
将状态映射到道具并使用道具不起作用。这样做让我输入超过2000的任何数字......
function mapStateToProps(state) {
return {
...
breakfast_salt_amt_1: state.stats.breakfast_salt_amt_1,
...
}
}
<input type="number" className="no-spin"
min="0" max="2000"
value={breakfast_salt_amt_1}
{...breakfast_salt_amt_1} />
只是使用状态也不起作用......
<input type="number" className="no-spin"
min="0" max="2000"
value={state.stats.breakfast_salt_amt_1}
{...breakfast_salt_amt_1} />
// => Uncaught TypeError: Cannot read property 'stats' of null
我忘记了什么?
答案 0 :(得分:8)
这是Normalizing的用途。像这样(未经测试):
const under2k = value => {
if(value < 0) {
return 0
} else if(value > 2000) {
return 2000
} else {
return value
}
}
<Field
name="breakfastSaltAmt"
component="input"
type="number"
normalize={under2k}/>
答案 1 :(得分:0)
我认为这可以帮到你:
<input type="number" className="no-spin"
min="0" max="2000"
value={this.props.breakfast_salt_amt_1}
{...breakfast_salt_amt_1} />
答案 2 :(得分:0)
MyTree n -> (forall m z. Plus n m z => [ MyTree ('Succ z) ] -> r) -> r