Reputation: 1
I want to use the handle function within the input tag. But it's showing an error when I call this function on the main page.
main code:
const Input = ({ placeholder, name, type, value, handleChange }) => (
<input
placeholder={placeholder}
type={type}
step="0.0001"
value={value}
onChange={(e) => handleChange(e, name)}
className="my-2 w-full rounded-sm p-2 outline-none bg-transparent text-white
border-none text-sm white-glassmorphism"
/>
);
Where the handle Change is declared:
const handleChange = (e, name) => {
setformData((prevState) => ({ ...prevState, [name]: e.target.value }));
};
Upvotes: 0
Views: 1523
Reputation: 6967
You can use in this way
const MyTextInput = ({ value, name, type, onChange }) => {
return (
<TextInput
value={value}
onChangeText={text => onChange({ name, type, text })}
/>
);
};
And then use it whenever you need to use TextInput
handleChange(event) {
const {name, type, text} = event;
.....
}
<MyTextInput name="username" type="text" value={this.state.username} onChange={this.handleChange}}>
<MyTextInput name="password" type="number" value={this.state.password} onChange={this.handleChange}}>
Upvotes: 1