Javascript react Native onChange事件的名称类型值未定义

我正在将NativeBase用于react native应用程序。 当输入字段上的文本更改时，我试图触发事件

<Input style={Styles.VehicleMeterCenter} placeholder={this.props.item['name']} 
                    value={this.state.item.name} onChange={this.onFieldChange}/>

我对我得到的输出感到困惑，没有类型、值或名称。我不确定如何分类处理程序是否是从哪个输入字段触发的，因为这些结构中没有此类信息

上述代码的输出：

    10:40:46 AM: Master

10:40:46 AM: {"dispatchConfig":null,"_targetInst":null,"isDefaultPrevented":null,"isPropagationStopped":null,"_dispatchListeners":null,"_dispatchInstances":null,"type":null,"target":null,"eventPhase":null,"bubbles":null,"cancelable":null,"defaultPrevented":null,"isTrusted":null,"nativeEvent":null}

10:40:46 AM: Native Event

10:40:46 AM: {"target":622,"eventCount":1,"contentSize":{"height":24,"width":399470.46875},"text":"D"}

10:40:46 AM: undefined : undefined : undefined

我想要实现的是，我应该能够识别哪个输入字段触发了事件，并插入值。

我使用“onChangeText”

您还可以使用onChange，如：

<TextInput onChange={(evt) => this.handleChange(evt, "name")}>{this.state.name}</TextInput>

看这个

 handleChange(event, name) {
    this.setState(() => ({ [name]: event.nativeEvent.text }));
  }

---

谢谢

我知道这是一篇老文章，但肯定需要更新答案

changeText =(e)=>{
    // fetches the props passed in textInput ... remove the console to understand more
    // console.log("e",e.target._internalFiberInstanceHandleDEV.memoizedProps) 

    // fetches  value
    // console.log("e",e.nativeEvent.text)
    let name = e.target._internalFiberInstanceHandleDEV.memoizedProps.name // fetches name i.e "Testing"
    let value = e.nativeEvent.text
    console.log(name)
    this.setState({...this.state,
       signUpfields : {...this.state.signUpfields,
            [name]:value
       }
    })
}

<View>
    <Text>{text}</Text>
        <TextInput
           placeholder="testing a textinput"
           name="Testing" 
           onChange={this.changeText}
           defaultValue="Test"
        >
    </TextInput>
</View>

changeText=（e）=>{
//获取在textInput中传递的道具…移除控制台以了解更多信息
//console.log（“e”，e.target._internalfiberstancehandledev.memorizedprops）
//获取价值
//console.log（“e”，e.nativeEvent.text）
让name=e.target.\u internalFiberInstanceHandleDEV.memorizedprops.name//获取名称，即“测试”
让值=e.nativeEvent.text
console.log（名称）
this.setState（{…this.state，
注册字段：{…this.state.signUpfields，
[名称]：值
}
})
}
{text}

---

这对我来说确实有效。可能也适合您。

欢迎使用StackOverflow。考虑将你的答案添加到包含的代码中。例如，你可以解释为什么他们发布的代码不起作用，你的答案如何解决OP提出的问题，等等+99-我真希望这在文档中更清楚。。。花了2个小时试图使用NativeBase查找输入值。为什么在setState中使用箭头函数？我只是好奇，我以前从未见过。我只知道这个.setState（{[name]：value}）；我认为最好只使用一种格式，因为在某些情况下，这个.setState（{…}）可能不会给出预期的结果。有趣的链接。但是我不认为在没有参数的情况下使用arrow函数会有任何好处。你应该通过之前的状态和道具。在这种情况下，您只会得到负面消息，因为React无法批量更新，因此性能较差。事实上，在这种情况下，它根本不适用，因为您在setState中设置的值来自用户，而不是任何道具或以前的状态。但是如果我错了，请纠正我。是的，在这种情况下，您也可以使用这个.setState（{…}）以及.e.target.\u internalFiberInstanceHandleDEV.memorizedprops.name仅在开发中有效，而不在生产构建中有效。当我为应用程序创建prod build时，这个错误不断出现。所以最后不得不使用onChangeText。

<TextInput onChange={(evt) => this.handleChange(evt, "name")}>{this.state.name}</TextInput>

handleChange(evt, name) {
    const { text } = evt.nativeEvent;
    this.setState(() => ({ [name]: text }));
  }

 handleChange(event, name) {
    this.setState(() => ({ [name]: event.nativeEvent.text }));
  }

changeText =(e)=>{
    // fetches the props passed in textInput ... remove the console to understand more
    // console.log("e",e.target._internalFiberInstanceHandleDEV.memoizedProps) 

    // fetches  value
    // console.log("e",e.nativeEvent.text)
    let name = e.target._internalFiberInstanceHandleDEV.memoizedProps.name // fetches name i.e "Testing"
    let value = e.nativeEvent.text
    console.log(name)
    this.setState({...this.state,
       signUpfields : {...this.state.signUpfields,
            [name]:value
       }
    })
}

<View>
    <Text>{text}</Text>
        <TextInput
           placeholder="testing a textinput"
           name="Testing" 
           onChange={this.changeText}
           defaultValue="Test"
        >
    </TextInput>
</View>