I have an MUI Input component defined like this where the oninput (tried as onInput as well) attribute doesn't get picked by MUI
<Input
variant="standard"
size="small"
type="number"
inputProps={{
min: '0',
oninput: "validity.valid||(value='');",
}}
onChange="validity.valid||(value='');"
/>
As the MUI doc says,
inputProps object {} Attributes applied to the input element.
And well, oninput is a valid Event attribute for the input element but on render, the underlying native HTML input element has only the min attribute defined and the oninput attribute is missing.
What is going wrong here? I even tried it with onChange but to no success.
You should pass a function parameter as onInput prop instead of a string like this:
const handleOnInput = (e) => {
//e.target.value
};
<Input
value={val}
variant="standard"
size="small"
type="number"
inputProps={{
min: "0",
onInput: handleOnInput
}}
/>
You can take a look at this sandbox for live working example.