Dev Faq
0
votes

Ceci.Setate ne fonctionne pas pour mon projet natif de réact

sur mon application native réactive que je développe cela.Setate ne fonctionne pas et ne mettant pas à jour la valeur dans le constructeur. Mais cela fonctionne ({}) fonctionne. Mais lorsque j'utilise que c'est réinitialiser le constructeur, tout le monde veuillez pointer ce qui ne va pas dans ce code 

import React from 'react';
import { StyleSheet, Text, View, TouchableOpacity, TextInput, Image } from 'react-native';
import { RkTextInput, RkButton } from 'react-native-ui-kitten';
import * as firebase from 'firebase';

export default class Home extends React.Component {
    constructor(props) {
        super(props)

        this.state = {
            uType: 'normal',
            AdminNavbutton: ''
        }
    }

    ProfileSubmithandler = () => {
        alert(this.state.uType + " " + this.state.AdminNavbutton)
    }

    componentDidMount() {
        this.readUserData();
    }

    readUserData = () => {
        userstype = 'users/' + firebase.auth().currentUser.uid + '/userType'

        firebase.database().ref(userstype).once('value').then(snapshot => {
            this.setState({ uType: snapshot.val() }) // notworking and not updating uType
            alert(snapshot.val()) //working Properly
        })

    }

    emailid = () => {

    }

    render() {
        return (
            <View style={styles.container}>
                <Text style={styles.titleText}>Taams</Text>
                <Text style={styles.edition}>Developer's Edition</Text>
                <Text style={styles.titleText}>Home</Text>
                <Text>Alpha 0.0.0.1</Text>
                <RkButton onPress={() => this.ProfileSubmithandler()}>
                    <Text style={styles.LoginButtonText}>Submit</Text>
                </RkButton>
                <TouchableOpacity onPress={() => this.props.navigation.navigate(this.state.AdminNavbutton)}><Text style={styles.signinButton}>Profile</Text></TouchableOpacity>
            </View>
        );
    }
}

0 commentaires

3 Réponses :

1
votes

this.setstate () est asynchrone, votre valeur mise à jour sera désormais disponible juste après l'appeler.

Lorsque SetState () est effectué la mise à jour de votre valeur, Vous pourrez accéder aux données mises à jour de votre fonction rendu sous this.type.type .

Si vous allez utiliser votre valeur tout de suite Dans votre fonction, vous devez le mettre dans une autre variable: xxx

3 commentaires

SetState Fournit le rappel comme deuxième argument, au cas où vous souhaitez vérifier la valeur en état après la mise à jour de l'état.

Bien sûr, c'est une autre alternative.

@Treycos et a également amélioré mon réact et réagir des versions natives

0
votes

C'est à cause du problème d'asyncrouse dans la consigne. Laissez le bouton indiqué lorsque les données extraites de Firebase et des états deviennent définies. Vous êtes ici: 

           import React from 'react';
                    import { StyleSheet, Text, View, TouchableOpacity, TextInput, Image } from 'react-native';
                    import {RkTextInput, RkButton } from 'react-native-ui-kitten';
                    import * as firebase from 'firebase';



                    export default class Home extends React.Component {
                      constructor(props){
                        super(props)

                        this.state={
                          uType:'normal',
                          AdminNavbutton:false,
                        }
                      }

                      ProfileSubmithandler=()=>{
                        alert(this.state.uType + " " + this.state.AdminNavbutton)


                      }
                      componentDidMount() {
                        this.readUserData();
                      };

                      readUserData=()=> {
                        userstype= 'users/'+ firebase.auth().currentUser.uid + '/userType'

                        firebase.database().ref(userstype).once('value').then(snapshot => {
                            this.setState({ uType: snapshot.val() }) // notworking and not updating uType
                            alert(snapshot.val()) //working Properly
                        })

                        }
                        emailid=()=>{
                        }


                      render() {
                        return (

                          <View style={styles.container}>
                            <Text style={styles.titleText}>Taams</Text>
                            <Text style={styles.edition}>Developer's Edition</Text>
                            <Text style={styles.titleText}>Home</Text>
                            <Text>Alpha 0.0.0.1</Text>
                         {
                          this.state.AdminNavbutton &&
                            <RkButton onPress = {()=>this.ProfileSubmithandler()}>
                              <Text style={styles.LoginButtonText}>Submit</Text>
                            </RkButton>



                        <TouchableOpacity onPress={()=>this.props.navigation.navigate(this.state.AdminNavbutton)}><Text style={styles.signinButton}>Profile</Text></TouchableOpacity>
                        }
                          </View>
                        );
                      }
                    }

1 commentaires

amélioré mon réactez et réagissez des versions natales qui ont corrigé mes problèmes

1
votes

Vous avez oublié de déclarer une variable pour "usersType" - ligne 25

1 commentaires

Amélioré mon réactez et réagissez des versions natales qui ont corrigé mes problèmes

Articles qui pourrait vous intéresser :

Mon application create-react ne parvient pas à se compiler en raison d'une erreur ESLint
Erreur: Node Sass version 5.0.0 est incompatible avec ^ 4.0.0
La réinitialisation de React-hook-form fonctionne correctement, les champs de saisie ne se vident toujours pas après l'envoi
Changer le format numérique du champ d'entrée dans le mode d'édition de ligne de table d'Antd?