0

I'd like to know why this code doesn't work :

<TextInput 
  style={style.inputLogin} 
  onChangeText={this.handleInputChange} 
  value={this.state.login} 
/>

with the function :

  handleInputChange = (event) => {
    console.log(event.target.name);
    this.setState({
      [name]: value
    });
    console.log("name => ", [name]);
    console.log("value => ", value);
  }

I tried many things but i can't get the targeted form. Should I make one function for each input ? seems to be stupid :/ event only contains the value of the form. Sure I could do this :

 <TextInput 
  style={style.inputLogin} 
  onChangeText={(value) => this.setState({value})) 
  value={this.state.login} 
/>

But this is not what I am looking for. I would like something more generic that works for every input

Please help me ;)

1 Answer 1

1

According to doc

onChangeText Callback that is called when the text input's text changes. Changed text is passed as a single string argument to the callback handler.

So the value passed by onChangeText is a string, not an event. In your handleInputChange you can treat text like

  handleInputChange = (text) => {
    console.log(text);
    // ...
  }

In order to handle multiple textInput with just a function, customize it like:

<TextInput 
  style={style.inputLogin} 
  onChangeText={(text) => this.handleInputChange(text, "Something to tell your function you're calling it from first textinput")} 
  value={this.state.login} 
/>

And then

  handleInputChange = (text, fromWhichTextInputAreYouCallingMe) => {
    console.log(text);
    this.setState({
      login: text
    });
  }
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.