MUI Input组件无法识别oninput、onInput属性问题咨询
问题原因
- React 不支持字符串形式的内联事件处理逻辑。原生 HTML 中可以直接给事件属性赋值字符串脚本,但 React 所有事件属性仅接收函数类型的参数,传入字符串会被直接忽略,这是你配置的事件丢失、不生效的核心原因。
inputProps内的事件属性需要遵循 React 驼峰命名规范。原生全小写的oninput对应 React 规范的onInput,写全小写格式会被判定为无效属性不会被挂载到原生元素上。- MUI
Input组件的根级onChange是组件封装后的合成事件,同样要求传入函数作为参数,你传入的字符串本身不符合语法要求,自然无法生效。
正确实现示例
如果你需要实现非法输入自动清空的逻辑,写法如下:
<Input variant="standard" size="small" type="number" inputProps={{ min: '0', onInput: (e) => { e.target.validity.valid || (e.target.value = '') } }} />
内容的提问来源于stack exchange,提问作者Aakash Verma
相关产品推荐
相关产品推荐

