Reactjs 可以在构造函数中获取该值，但TypeError:无法读取属性'；xxx和x27；在渲染函数中输出未定义的

在

console.log（以下代码的
getData（）
中的数据[“用户”][“用户ID”][“点”]）中，输出20

但是在
render（）
{JSON.stringify（this.state.users.userId.points）}
当你跑的时候

TypeError:无法读取未定义的属性“点”
错误被输出

我如何{JSON.stringify（this.state.users.userId.points）}
可以输出为20吗

import React from 'react';
import { Text, View, Button, StyleSheet, TouchableHighlight, FlatList} from 'react-native';
import { FloatingAction } from "react-native-floating-action";
import Icon from 'react-native-vector-icons/FontAwesome5';
import * as firebase from 'firebase';
import 'firebase/firestore';
import env from '../../env.json';

interface Props {
  navigation: any;
  route:any;
  authorId:string;
  postId:string;
  userId:string;
  win:string;
  wni:string;
  ideas:any;
  }

  interface State {
    actions:{
      text:string,
      icon:JSX.Element,
      name:string,
      position:number
    }[],
    data:any,
    points:number
    users:any
  }

  const firebaseConfig = {
    apiKey: env.apiKey,
    authDomain: env.authDomain,
    databaseURL: env.databaseURL,
    projectId: env.projectId,
    storageBucket: env.storageBucket,
    messagingSenderId: env.messagingSenderId,
    appId: env.appId,
    measurementId: env.measurementId
  };

  if (firebase.apps.length === 0) {
    firebase.initializeApp(firebaseConfig);
  }

  const db = firebase.firestore();

  export class Rank extends React.Component<Props,State> {
      constructor(props){
          super(props)
          this.state = {

            actions:[
              {
                text: "Write down features",
                icon: <Icon name="list" size={20}/>,
                name: "feature",
                position: 2
              },
              {
                text: "Post your idea",
                icon: <Icon name="lightbulb" size={20}/>,
                name: "idea",
                position: 1

              }
            ],
            data:{},
            points:0,
            users:{}
          }

          this.getData()
      }

      async getData(){
        let firestoreData = await db.collection("posts").doc(this.props.route.params.postId).get()
        let data = firestoreData.data()

        this.setState({
          data:data,
          users:data["users"]

        })

        console.log(data["users"]["userId"]["points"])
      }

      render(){
        return (
            <View
            style={styles.backgroundImage}
            >
        <Text>{JSON.stringify(this.state.users.userId.points)}</Text>
            </View>
        )
      }
  }

  const styles = StyleSheet.create({
    backgroundImage: {
        ...StyleSheet.absoluteFillObject,
      },
  })

从“React”导入React；
从“react native”导入{文本、视图、按钮、样式表、TouchableHighlight、平面列表}；
从“react native floating action”导入{FloatingAction}；
从“react native vector icons/FontAwesome5”导入图标；
从“firebase”导入*作为firebase；
导入“firebase/firestore”；
从“../../env.json”导入环境；
界面道具{
导航：任何；
路线：任何；
authord：字符串；
posted：字符串；
userId:string；
赢：弦；
wni：字符串；
想法：任何；
}
界面状态{
行动：{
文本：字符串，
图标：JSX.Element，
名称：string，
职位：编号
}[],
数据：任何，
点数：数字
用户：有吗
}
常量firebaseConfig={
apiKey:env.apiKey，
authDomain:env.authDomain，
databaseURL:env.databaseURL，
projectd:env.projectd，
storageBucket:env.storageBucket，
messagingSenderId:env.messagingSenderId，
appId:env.appId，
measurementId:env.measurementId
};
如果（firebase.apps.length==0）{
firebase.initializeApp（firebaseConfig）；
}
const db=firebase.firestore（）；
导出类扩展React.Component{
建造师（道具）{
超级（道具）
此.state={
行动：[
{
文字：“写下特征”，
图标：，
名称：“功能”，
职位：2
},
{
文字：“发布你的想法”，
图标：，
名称：“创意”，
职位：1
}
],
数据：{}，
分数:0,，
用户：{}
}
这个文件名为getData（）
}
异步getData（）{
让firestoreData=wait db.collection（“posts”）.doc（this.props.route.params.postId.get（））
let data=firestoreData.data（）
这是我的国家({
数据：数据，
用户：数据[“用户”]
})
console.log（数据[“用户”][“用户ID”][“点”]）
}
render（）{
返回(
{JSON.stringify（this.state.users.userId.points）}
)
}
}
const styles=StyleSheet.create({
背景图片：{
…StyleSheet.absoluteFillObject，
},
})
根据您的错误，this.state.users.userId未定义，因此当您尝试获取未定义的点时，代码将失败。试着一个接一个地分解对象，看看会发生什么，我想你在第一次渲染时会遇到这个错误，因为在这个状态中没有任何东西，所以会出现这个错误。尝试下面的代码，看看会发生什么

render(){
    const { userId } = this.state.users;
    return (
        <View
        style={styles.backgroundImage}>
        <Text>{userId ? JSON.stringify(userId.points): "Loading data.."}</Text>
        </View>
    )
}

render（）{
const{userId}=this.state.users；
返回(
{userId？JSON.stringify（userId.points）：“正在加载数据…”
)
}