At one stage this textfield was working fine but now every time it is selected it just loses focus immediately, so I am unable to input any text.
<InputField
fullWidth
placeholder="enter text"
value={text}
onChange={(e) => setText(e.value)}
onFocus={undefined}
/>
This causes loss of focus:
const InputField = ({ onChange, onFocus, ...textFieldProps }) => {
if (onFocus) {
return (
<TextField
onChange={(event) => onChange(event.target.value)}
onFocus={(event) => onFocus(event.currentTarget)}
{...textFieldProps}
/>
);
} else {
return (
<TextField
onChange={(event) => onChange(event.target.value)}
{...textFieldProps}
/>
);
}
};
Without the conditional it works fine:
const InputField = ({ onChange, onFocus, ...textFieldProps }) => {
return (
<TextField
onChange={(event) => onChange(event.target.value)}
{...textFieldProps}
/>
);
};