web-dev-qa-db-fra.com

Est-il possible de capitaliser la première lettre du texte/chaîne dans rea native? Comment faire?

Je dois mettre en majuscule la première lettre du texte que je veux afficher. Je l'ai cherché mais je ne peux pas trouver de solution claire pour le faire, il n'y a pas non plus de tels accessoires pour text dans les documents officiels autochtones.

Je montre mon texte au format suivant:

<Text style={styles.title}>{item.item.title}</Text>

ou

<Text style={styles.title}>{this.state.title}</Text>

Comment puis-je le faire?

Les suggestions sont les bienvenues? 

react-nativetextreact-native-androidreact-native-text
8
mayuresh patil

Écrire une fonction comme celle-ci

Capitalize(str){
return str.charAt(0).toUpperCase() + str.slice(1);
}

puis appelez-le à partir de la balise <Text>

<Text>{this.Capitalize(this.state.title)} </Text>
13
mayuresh patil

Au lieu d'utiliser une fonction, une méthode plus propre consiste à l'écrire en tant que composant commun.

import React from 'react';
import { View, Text } from 'react-native';

const CapitalizedText = (props) => {
  let text = props.children.slice(0,1).toUpperCase() + props.children.slice(1, props.children.length);

  return (
      <View>
        <Text {...props}>{text}</Text>
      </View>
  );
};

export default CapitalizedText;

Où que vous utilisiez <Text>, remplacez-le par <CapitalizedText>

10
Adam Kipnis

TextInput doit gérer cela avec 

autoCapitalize enum('none', 'sentences', 'words', 'characters')

par exemple essayez comme ça 

<TextInput
     placeholder=""
     placeholderTextColor='rgba(28,53,63, 1)'
     autoCapitalize = 'none'
     value ='test'
     />
1
Vishal Vaghasiya

Vous pouvez également utiliser la propriété text-transform css dans le style:

<Text style={{textTransform: 'capitalize'}}>{this.state.title}</Text>
1
tmsss