Désactiver les boutons sur réagir nativement

Je fais une application Android utilisant react native et j’ai utilisé le composant TouchableOpacity pour créer des boutons.
J’utilise un composant de saisie de texte pour accepter le texte de l’utilisateur et le bouton ne doit être activé que lorsque la saisie de texte correspond à une certaine chaîne.
Je peux imaginer un moyen de le faire en rendant d’abord le bouton sans le wrapper TouchableOpactiy et en le restituant avec le wrapper une fois que la chaîne d’entrée correspond.
Mais je devine qu’il y a une meilleure façon de le faire. Quelqu’un peut-il aider?

TouchableOpacity TouchableWithoutFeedback , vous pouvez donc utiliser la propriété disabled :

  I'm disabled  

Réagir à la documentation native de TouchableWithoutFeedback #disabled

Fais juste ça

   {text}   

Cela semble être le genre de chose qui pourrait être résolu en utilisant un composant d’ordre supérieur. Je peux me tromper parce que j’ai du mal à le comprendre moi-même à 100%, mais peut-être que cela vous sera utile (voici quelques liens) …

Vous pouvez créer un CustButton avec TouchableWithoutFeedback , et définir l’effet et la logique que vous voulez avec onPressIn , onPressout ou d’autres accessoires.

TouchableOpacity reçoit activeOpacity . Vous pouvez faire quelque chose comme ça

   

Donc, s’il est activé, il aura l’air normal, sinon, cela ressemblera à du toucher sans retour.

J’ai pu résoudre ce problème en mettant un conditionnel dans la propriété style.

 const startQuizDisabled = () => props.deck.cards.length === 0;  Start Quiz  const styles = StyleSheet.create({ androidStartQuiz: { marginTop:25, backgroundColor: "green", padding: 10, borderRadius: 5, borderWidth: 1 }, androidStartQuizDisable: { marginTop:25, backgroundColor: "green", padding: 10, borderRadius: 5, borderWidth: 1, opacity: 0.4 }, androidStartQuizBtn: { color: "white", fontSize: 24 } }) 

cette base native contient une solution:

   

Désactivez TouchableOpacity utilisant le code suivant:

  Submit