J'ai un composant natif simple réactif: Il est utilisé par cette application: Je m'attends à ce que le testComponent et La vue jaune à afficher mais n'utilisant que l'espace requis et la vue bleue pour remplir le contenu restant. La zone jaune et bleue fonctionne comme prévu, mais le test de test n'est pas affiché. Pourquoi? Voir cette démo: 
4 Réponses :
La raison pour laquelle ' Vous devez définir des valeurs flexibles pour voir toutes les couleurs et les lettres. rouge: 1 jaune: 1 bleu: 8 === 1: 1: 8 === 0,1: 0,1: 0,8
Vous pouvez utiliser deux éléments si vous souhaitez rendre le texte égal à la hauteur de la deuxième vue. Vous pouvez utiliser ' ou Vous pouvez également utiliser supprimer la valeur flexible < / p> Voir l'écran testComponent ' n'est pas visible est que la valeur de flex parent est nulle. Le flex sera recouvert ensemble en jaune avec zéro.
flexbasis ou hauteur flexbasis ' et ' hauteur ' faire le même chose. flexshrink . 
Merci pour votre réponse. Je ne connais pas la hauteur de l'écran et je ne connais pas la hauteur de la teneur dans les conteneurs rouge et jaune. C'est pourquoi je ne suis pas capable de trouver une combinaison de flex qui rendra toujours les conteneurs ont la hauteur de la teneur en rouge et en vert.
@Dhrm vous pouvez supprimer la valeur flexible
@DHRM examine ma réponse révisée.
@DHRM Si ma réponse a été utile, veuillez sélectionner ma réponse?
N'utilisez tout simplement pas Flex: 0
Utilisez Flex: 1 dans le composant que vous souhaitez remplir l'écran de rester
Les 2 autres n'écrivent aucun flex
Ne semble pas fonctionner: snack.expo.io/rkng7wnib . Fonctionne bien sur leur point de vue Web, mais lors de l'exécution de mon propre appareil, le conteneur rouge n'est pas affiché.
parce que
Il suffit de supprimer flex: 0 code> de votre JSX et cela fonctionnera. export default class TestComponent extends React.Component {
render() {
return (
<View>
<Text>Test</Text>
</View>
);
}
}
Je ne suis pas capable de le faire travailler ici: snack.expo.io/rkng7wnib . Fonctionne bien sur leur point de vue Web, mais lors de l'exécution de mon propre appareil, le conteneur rouge n'est pas affiché.
Ok donnez-moi parfois, laissez-moi essayer un appareil
Donc, le testComponent lui-même ne peut-il pas utiliser Flex pour que cela fonctionne?
Étant donné que le parent n'a pas d'une propriété flex , l'enfant ne peut pas l'utiliser.
Vous devez simplement supprimer Veuillez vérifier ce lien de démonstration
https://snack.expo.io/@vishal7008/New-Component - a>
Image de démonstration de travail
flex: 1 à partir de 