2
votes

L'espace réservé de l'entrée de texte ne prend pas en charge RTL lors de l'utilisation du type de mot de passe dans React natif

lorsque je souhaite utiliser le type de mot de passe dans la saisie de texte avec les accessoires secureTextEntry, l'espace réservé ne prend pas en charge RTL

<TextInput style={styles.input}
                                   value={this.state.password}
                                   secureTextEntry={true}
                                   placeholder="Ø§Ù„Ø²Ø§Ù…ÛŒ"
                                   underlineColorAndroid="transparent"
                                   onChangeText={(text) => this.setState({password: text})}/>

et le résultat

Quelle est la solution à ce problème?

react-native

5 commentaires

Veuillez également partager le CSS. Merci

Voulez-vous dire le style?

Je viens d'écrire un exemple basique de direction: rtl , j'espère que cela vous aidera. Merci

mais c'est une solution web, ce bogue pour l'application native react

Je viens de mettre à jour ma réponse, j'espère que cela vous aidera. Merci

3 Réponses :

-2
votes

Je viens d'écrire un extrait de code de base avec direction: rtl; . J'espère que cela vous aidera. Merci

<TextInput style={styles.input} 
           value={this.state.password} 
           secureTextEntry={true} 
           placeholder="Ø§Ù„Ø²Ø§Ù…ÛŒ" 
           underlineColorAndroid="transparent" 
           onChangeText={(text) => 
           this.setState({password: text})}
           direction ='rtl'
/>

1 commentaires

Pouvez-vous créer un violon pour plus de précisions?

0
votes

vous devez configurer votre projet pour prendre en charge rtl . here est le guide officiel du blog react native. Faites-moi savoir si cela a fonctionné pour vous.

0 commentaires

3
votes

Veuillez vérifier cet extrait de code, il fonctionne avec les conditions RTL et LTR. J'ai également joint un extrait de code snack.expo.io

import { I18nManager,Text,TextInput, View, StyleSheet } from 'react-native';

    <View style={{ borderWidth: 1, marginTop: 20, borderColor: '#000' }}>
          <TextInput
            style={{
              color: '#000',
              borderColor: '#000',
              textAlign: I18nManager.isRTL ? 'right' : 'left',
            }}
            value={this.state.password}
            placeholder="Ø§Ù„Ø²Ø§Ù…ÛŒ"
            placeholderTextColor="#303030"
            secureTextEntry={true}
            underlineColorAndroid="transparent"
            onChangeText={text => this.setState({ password: text })}
          />
        </View>

Vous devez ajouter I18nManager pour vérifier que votre interface utilisateur est en mode RTL ou en mode LTR

0 commentaires