当获得输入文本时，为什么我的evt.target.value总是不确定

Question

我正在尝试拾取用户输入，保存到变量，然后派遣到商店。但是，无论我尝试什么，我总是会变得"不确定"，为什么这是？

我觉得我已经尝试了一切。我最初认为我的范围是错误的。然后我认为它只是无法设置/getState，但是它设置了状态，同样不确定。

import React from 'react';
import { View } from 'react-native';
import { Button, Input } from 'react-native-elements';

 export default class HomeScreen extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      inputValue: ''
    };
  }
  //update input value
  updateInputValue(evt) {
    console.log(evt)
    console.log(evt.target.value)
    let saveInputValue = evt.target.value
    this.setState({
      inputValue: saveInputValue
    });
    console.log(this.state)
  }
  render() {
    return (      
      <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
        <Input
          placeholder='User Input'
          containerStyle={{width:'50%'}}
          value={this.state.inputValue}
          onChange={evt => this.updateInputValue(evt)}
        />
        <View style={{flex:0.03}}/>
          <Button title="Go to Second Screen"
            //onPress={() => {this.handleClick()}}
            buttonStyle={{ backgroundColor: '#C7D8C6' }}
          />
      </View>
    );
  }
}

在UpdateInputValue（EVT）函数中：

console.log(evt) = SyntheticEvent {dispatchConfig: {phasedRegistrationNames: {captured: "onChangeCapture", bubbled: "onChange"}}, _targetInst: FiberNode, _dispatchListeners: function, _dispatchInstances: FiberNode, nativeEvent: {target: 3, text: "D", eventCount: 1}, …}

最初console.log(evt.target.value) = {inputValue: ''}（如预期）

但是onChange console.log(evt.target.valur) = {inputValue: undefined}

回答以后访问此帖子的任何人

这种最简单的方法是由下面的几个人提出的（谢谢）：

如果您需要的只是文本值本身，请使用onChangeText事件>：

onChangeText={text => this.updateInputValue(text)}

反应元素输入只是围绕React的包装器 本机textInput，并继承其所有道具，如您在 文档。

Answer 1

您可以做以下操作来完成此工作。

1-使用onChange内部使用箭头函数尝试setState。

onChange={event => this.setState({inputValue: event.target.value})}

2-尝试使您的UpdateInputValue方法成为箭头函数，因为在的JavaScript上下文中，此根据如何调用该函数进行更改。

updateInputValue = (evt) => {
    console.log(evt)
    console.log(evt.target.value)
    let saveInputValue = evt.target.value
    this.setState({
      inputValue: saveInputValue
    });
    console.log(this.state)
  }

Answer 2

如果您需要的只是文本值本身，请改用onChangeText事件：

onChangeText={text => this.updateInputValue(text)}

React-Native-element-Elements输入只是围绕React本机TextInput的包装器，并继承了其所有道具，如您在文档中所见。

Answer 3

看来您正在使用React Native Elements UI kit。UI套件提供的输入组件使用RN。给出的默认文本in。

给出的相同道具

假设您使用此回调，您可以通过两种方式获得文字。

handleTextChange = (text) => {
  this.setState({
    youName: text,
  })
}

方法提及您应该将哪些道具传递给<Input />

方法1

onChange={evt => this.handleTextChange(evt.nativeEvent.text)} // As given by RN Docs

方法2

onChangeText={text => this.handleTextChange(text)}

注意：对象从 onChange方法的事件对象中获取如下。

{
   nativeEvent: {
     eventCount,
     target,
     text
   }
}

希望这会有所帮助。提及评论的任何澄清。