Hello, I'm losing focus when typing any letter in my input
Component and your call
const RenderInput = this.renderInput;
<Field
name="email"
//component={this.renderInput}
component={(props) => <this.renderInput {...props} onChangeTextDestino={this.onChangeTextDestino.bind(this)} />}
type="email"
validate={[email, required]}
/>
renderInput({input, label, type, meta: { touched, error, warning } ,onChangeTextDestino}) {
return (
<View>
<Item error={error && touched} rounded style={styles.inputGrp}>
<Icon
active
name={input.name === "email" ? "mail" : "unlock"}
style={{ color: "#fff" }}
/>
<Input
ref={c => (this.textInput = c)}
placeholderTextColor="#FFF"
style={styles.input}
placeholder={input.name === "email" ? "Email" : "Senha"}
secureTextEntry={input.name === "password" ? true : false}
onChangeText={text => onChangeTextDestino(input.name,text)}
{...input}
/>
{touched && error
? <Icon
active
style={styles.formErrorIcon}
onPress={() => this.textInput._root.clear()}
name="close"
/>
: <Text />}
</Item>
{touched && error
? <Text style={styles.formErrorText1}>
{error}
</Text>
: <Text style={styles.formErrorText2}>error here</Text>}
</View>
);
}
constructor and function:
constructor(props){
super(props);
this.state = {
strEmail: '',
strSenha: ''
};
this.onChangeTextDestino = this.onChangeTextDestino.bind(this)
}
textInput: Any;
onChangeTextDestino(param, value) {
try {
if (param === "email") {
this.setState({
strEmail: value
})
} else {
this.setState({
strSenha: value
})
}
} catch (e) {
console.log("error", e)
}
}
What should I do to stay focused?