Conditioning a button on React Native

Question

I have a button that should be able to do an operation only if a previous validation is true, but to be honest I don't know how to do it; what I did is really messy so I belive there should be a correct way of doing this.

So this is what I've tried. I'm using hooks:

<View style={styles.buttonContainer2}>
          <TouchableOpacity 
            style={ styles.logout}  
            onPress={
              if( vValidCellphone == true{
                () => onSubmit({
                  vSecondLastName, vCellphone, vBirthDate, vRFC, vGender, vEmail,vCreationUser
                })
              })}>  
          <Text style={styles.loginText}>GUARDAR</Text>
          </TouchableOpacity>

Answer 1

You can use touchable opacity props called disabled. Set it true to disable the onclick action as below :

<TouchableOpacity 
            style={ styles.logout}  
         disabled={!vValidCellphone} 
            onPress={() => onSubmit({
                  vSecondLastName, vCellphone, vBirthDate, vRFC, vGender, vEmail,vCreationUser
             })}>  
          <Text style={styles.loginText}>GUARDAR</Text
</TouchableOpacity>

In addition you can style your button according to disable condition to style button like disabled.