我无法在 React Native 中设置状态

Question

在这个项目中，我想使用从Firebase数据库中检索到的数据来设置userType的状态。 从Firebase获取工作正常，但我无法从那里设置userType的状态

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

export default class Home extends React.Component {
  constructor(props){
    super(props)
    this.state=({
      userId:firebase.auth().currentUser.uid,
      userType:'f'
    })
  }
  componentDidMount() {
    this.readUserData();
  };
  readUserData=()=> {
    userstype= 'users/'+ this.state.userId + '/userType'
    firebase.database().ref(userstype).on('value', function (snapshot) {
      this.state=({userType:snapshot.val()})
    });
      alert(this.state.userType)
    }

  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>
      </View>

Answer 1

要设置状态，请尝试执行以下操作而不是this.state=({userType:snapshot.val()})： this.setState({ userType:snapshot.val() });

Answer 2

仅在构造函数中使用this.state ={}。 它应该在其他地方。

this.setState({}) 

所以改变

    firebase.database().ref(userstype).on('value', function (snapshot) {
  this.state=({userType:snapshot.val()})
});

自

    firebase.database().ref(userstype).on('value', function (snapshot) {
  this.setState({userType:snapshot.val()})
});

Answer 3

firebase.database().ref(userstype).on('value', (snapshot) => {
  this.setState({userType: snapshot.val()})
});

这可能是上下文问题。如果不绑定匿名函数，您将丢失原始上下文。尝试使用 ES6 的箭头函数和 this.setState（{}）