Estoy enfrentando un problema extraño. En mi aplicación nativa de reacción, tengo condiciones que representan View y ScrollView . El problema es que la declaración falsa se muestra primero antes de la declaración verdadera, por lo que tengo un ejemplo a continuación, digamos que PinCodeVisible.showPinLock is true , por lo que Pincode no debe mostrar la declaración falsa, que es el texto. Mi problema es que muestra primero la declaración falsa, que es el text , y luego, después de cargar la declaración verdadera, que es un pincode , solo quiero ignorar el text debajo de la declaración falsa, ya que es falso.
¿Por qué se muestra incluso si es una declaración falsa? ¿Me perdí algo?
const [PinCodeVisible, setPin] = useState({ PINCodeStatus: "choose", showPinLock: false }); React.useEffect(() => { setPin({ showPinLock: true}); //let say the pincode is true }, []) return ( <View style={styles.container} > {PinCodeVisible.showPinLock === true ? ( <PINCode // modalVisible={modalVisible} status={PinCodeVisible.PINCodeStatus} touchIDDisabled={true} finishProcess={() => _finishProcess()} timeLocked={5000} /> ) : <ScrollView style={styles.container}> //this scrollview shown first event the statement is true <Text>This text will show before the true statement above</Text> // it should not shown because the statement is true </ScrollView>} </View> ) const styles = StyleSheet.create({ container: { flex: 1, }Puede verificar las siguientes cosas,
const [pinCodeVisible, setPin] = useState({ PINCodeStatus: "choose", showPinLock: true });
setPin({ ... pinCodeVisible, showPinLock: true});
return ( <View style={styles.container}> {(pinCodeVisible.showPinLock && ( <PINCode finishProcess={() => _finishProcess()} status={pinCodeVisible.PINCodeStatus} timeLocked={5000} touchIDDisabled={true} /> )) || ( <ScrollView style={styles.container}> <Text>This text will show before the true statement above</Text> </ScrollView> )} </View> );