Question

我想知道为什么这段代码不起作用：

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

具有以下功能：

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

我尝试了很多事情，但无法获得目标表格。我应该为每个输入做一个功能吗？似乎是愚蠢的：/ 事件仅包含表单的值。我当然可以这样做：

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

但这不是我想要的。我想要更通用的东西，适用于每个输入

请帮助我;）

Answer 1

根据doc

onChangeText文本输入的文本时调用的回调变化。更改后的文本作为单个字符串参数传递给回调处理程序。

因此，onChangeText传递的值是字符串，而不是事件。在您的handleInputChange中，您可以像对待text

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

为了仅使用一个函数即可处理多个textInput，请对其进行自定义，如：

<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} 
/>

然后

  handleInputChange = (text, fromWhichTextInputAreYouCallingMe) => {
    console.log(text);
    this.setState({
      login: text
    });
  }

如何在通用反应本地处理多输入？

1 个答案: