首页 > 解决方案 > 仅为已部署的 React 应用程序获取“TypeError:this.state.users.map 不是函数”

问题描述

使用 React 构建了一个 Web 应用程序,以从 Firestore 数据库中提取用户信息。在本地运行应用程序时,它运行完美,我可以加载用户信息。部署后,我现在收到“TypeError:this.state.users.map 不是函数”消息,页面甚至无法加载。为什么它会在部署之前工作,解决方法是什么?

import React, { Component } from 'react';
import AllCoaches from '../components/search/AllCoaches';
import Banner from '../components/layout/banner';
import axios from 'axios';

// MUI Stuff
import Grid from '@material-ui/core/Grid';
import CircularProgress from '@material-ui/core/CircularProgress';


class coaches extends Component {
    state = {
        users: []
      }

  componentDidMount() {
    axios.get('/coaches')
        .then(res => {
            console.log(res.data)
            this.setState({
                users: res.data
            })
        })
        .catch(err => console.log(err));
  }

    render() {
    let coaches = this.state.users ? (
        this.state.users.map((user) => <AllCoaches user={user}/>)
    ) : ( <CircularProgress/> );
      return (
        <Grid container>
        <Banner/>
            {coaches}
        </Grid>
        );  
    }   
}


export default coaches

标签: reactjsgoogle-cloud-firestoreaxios

解决方案


推荐阅读