REACT NATIVE - this.setState 在 onChangeText 中不起作用

Question

我正在尝试使用性别选择在此处创建有条件的 onPress。如果性别未定义，我将无法继续。非常简单。但我是新手，我没有发现这里的问题。

这是州的性别支柱...

  constructor(props) {
super(props);
this.state = {
  gender: ''
};

这就是具有这 3 个性别值的 const genderSelect...

render() {
const genderSelected = [
  { value: 'Feminino', label: 'Feminino' },
  { value: 'Masculino', label: 'Masculino' },
  { value: 'Outro', label: 'Outro' }
];

... }

那是我的下拉列表 class，我在其中调用 genderSelect 并尝试使用 setState（但它不起作用，'console.log' 一直返回 'undefined'）。最后，这是我的条件 onPress。

 return (
   <>
          <Dropdown
            label='Selecione...'
            data={genderSelect}
            baseColor={"white"}
            textColor={"white"}
            itemColor={"white"}
            pickerStyle={{
              backgroundColor: "black"
            }}
            onChangeText={(value) => {
              this.setState({ gender : value })
              console.log(this.gender)
            }}
          />
            <TouchableOpacity
              style={styles.buttonContainer}
              onPress= {()=>{
                if (this.gender != undefined ) {
                  console.log(this.gender)
                  this.props.navigation.navigate("Abas")
                }
                else {
                  console.log(this.gender)
                  Alert.alert('Ops!','Favor preencher sua idade e gênero antes!');
                }
              }}
            >
              <Text style={styles.buttonText}>CONFIRMAR</Text>
            </TouchableOpacity>

顺便说一句，我想问题发生在 onChangeText / setState 部分。不管我之后怎么用'if / else'，它一直返回'undefined'.

我知道，这可能是一个简单的问题，我没有找到原因。我对此进行了很多搜索，但 none 的答案确实对我有所帮助。希望有人能帮助我。

Answer 1

将this.gender替换为this.state.gender

那是错误。gender 是一个状态变量，因此您必须这样访问它。

在你的 return 部分改变这个

<TouchableOpacity
    style={styles.buttonContainer}
    onPress={() => {
      if (this.state.gender != undefined) {
        console.log(this.state.gender);
        this.props.navigation.navigate('Abas');
      } else {
        console.log(this.state.gender);
        Alert.alert('Ops!', 'Favor preencher sua idade e gênero antes!');
      }
    }}>
  <Text style={styles.buttonText}>CONFIRMAR</Text>
</TouchableOpacity>

REACT NATIVE - this.setState 在 onChangeText 中不起作用

REACT NATIVE - this.setState doesn't work inside onChangeText

reactjs

expo

native

setstate