Y a-t-il un problème connu avec TextTransform: «majuscule» avec Android?
Je suis assez nouveau dans React natif et je viens de terminer la création de vues, toutes avaient l'air bien dans Ios mais sur Android - aucun bouton ne s'affiche. Après une série d'essais et d'erreurs, j'ai trouvé que le problème semble être textTransform: 'uppercase', si je supprime ceci de la feuille de style, le texte s'affiche correctement.
Quelqu'un a-t-il rencontré cela? Je ne trouve aucune information sur le bogue sur le Web.
Voici mon code:
btnText:{
color:'#fff',
marginRight:14,
marginLeft:10,
fontSize:20,
alignSelf: 'center',
marginTop:-3,
textTransform:'uppercase',
},
avec le style:
return (
<View style={AppStyles.buttonRect} >
<View style={AppStyles.buttonRectWrap}>
<Image style={AppStyles.buttonRectIcon} source={this.props.buttonIcon} />
<Text style={AppStyles.btnText}>{this.props.buttonTxt}</Text>
</View >
</View>
);
qui se traduit par -
Si je supprime la ligne de transformation:
J'ai essayé plusieurs simulateurs et j'obtiens la même erreur.
4 Réponses :
Il s'agit actuellement d'un bogue avec React Native. Un correctif semble être dans la version 0.59.0, car les candidats à la version 0.59.0 ne contiennent pas le bogue. Source: https://github.com/facebook/react-native/issues/21966 < / a>
Il y a un problème connu. Fondamentalement, l'utilisation de textTransform interrompt le style du texte pour Android. Même textTransform: aucun ne cassera votre style. Lien du problème: https://github.com/facebook/react-native/issues/21966
Je suis confronté au même problème avec la version 0.58.5 native de react, cela semble être un bogue bien connu. Essayez d'utiliser JS normal pour mettre en majuscule les chaînes pour le moment:
capitalizeString = (text: string) => typeof text === 'string' && text.length> 0 && $ {text [0] .toUpperCase ()} $ {text.slice (1)}
capitalizeString ('mystring')
ou simplement: string.toUpperCase ();
ref: https://github.com/facebook/react-native/issues / 21966
La solution de contournement que j'ai trouvée à ce problème était de créer un composant qui restitue les props.children et d'enchaîner la méthode .toUpperCase.
Il semble que ce soit un bogue connu: github.com/facebook/react-native/issues / 21966
cela explique - si vous voulez ajouter comme réponse i; je vous coche @ChrisStillwell. à votre santé