You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

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

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.09.29 14:27:08