通过函数更新状态的正确方法

时间:2019-09-13 01:53:12

标签: reactjs react-native react-native-android react-native-ios

我对React-native非常陌生,但我的问题是:我想知道如何使用函数更新状态。我以前是通过

完成的
onChangeText = {(text) => this.setState({ FirstName: text })} 
TextInput组件上

,但是我用一个可帮助我验证文本输入的函数代替了它。我决定要在onPress操作之后存储状态。

这是课程

class NameScreen extends Component {
    constructor(props) {
        super(props);
        this.state = { FirstName: "", 
                       FirstNameValidate:false,
                       LastName: "", 
                       LastNameValidate:false,
                       PreferredName: "",
                       flag:false }
}

这是渲染调用的一部分

<TextInput 
  style={styles.nameScreen} 
  placeholder='Last Name'  
  returnKeyType= "next" 
  underlineColorAndroid={LastNameValidate? 'black': 'red'} 
  placeholderTextColor='rgba(0,0,0,.3)' 
  onChangeText={(text) => this.validate(text,'Last Name')}
   />

<TouchableOpacity 
  style={styles.YellowButtonContainer} 
  onPress= {() => this.RequiredFields("Name")}>

我想更新this.RequiredFields("Name")中的状态,但是我不太确定如何更新这些状态

这是函数

RequiredFields = (type) => 
{
  if(type == "Name"){
    navigateFirstNext = this.props.onPress;

    if(!this.state.FirstNameValidate || !this.state.LastNameValidate)
    {
      console.log("not")
      Alert.alert(
        "Please fill out al the required fields",
        null,
        [
          { text: "Okay", onPress: () => console.log("OK Pressed") }
        ],
        { cancelable: false }
      );
    }
    else
    {
      this.props.onChangeText = (text) => this.setState({ FirstName: text })
      this.props.onChangeText = (text) => this.setState({ LastName: text })
      navigateFirstNext = this.props.navigation.navigate('PhoneAndEmailScreen');

    }
}
}

我希望这有道理。让我知道是否有任何不清楚的地方。

0 个答案:

没有答案