首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >Axios未定义响应

Axios未定义响应
EN

Stack Overflow用户
提问于 2021-11-26 22:55:38
回答 1查看 79关注 0票数 1

我正在开发MERN堆栈项目。问题是,当我进行第一个API调用时,第一个响应是未定义的,并且map函数给出了一个错误'Map不是一个函数,它很有意义。问题是我尝试了几种方法来防止这种情况发生,但是它不能工作

代码语言:javascript
运行
复制
import {
    BrowserRouter as Router,
    Switch,
    Route,
    Link
} from "react-router-dom";
import axios, { Axios } from "axios"
import { useState, useEffect } from "react";
import '../index.css'

function SearchResults() {
    const [searchValues, setSearchValues] = useState({})
    useEffect(() => {
        receivedata();
    }, [searchValues])

    const receivedata = async () => {
        await axios.get('http://localhost:3001/getresults').then((response) => {
            setSearchValues(response.data)
            console.log(searchValues);
            console.log("holaaaa")
            console.log(searchValues.length)
        }).catch(err => {
            console.log(err)
            console.log("i am here")

        })
    }

    return (
        <SearchDisplay></SearchDisplay>
    );

    function SearchDisplay() {
        return (
            <div>

                { searchValues.length !== 0 || typeof searchValues != undefined ? searchValues.map(flight => {
                    return <div className="flights">
                        <ul >
                            <li>Flight Number : {flight.FlightNumber} </li>
                            <li>Arrival Time : {flight.ArrivalTime} </li>
                            <li> Departue Date : {flight.DepartureDate} </li>
                            <li> Arrival Terminal : {flight.ArrivalTerminal} </li>
                            <li> Departure Terminal : {flight.DepartureTerminal} </li>
                            <li> Economy Seats : {flight.EconomySeats}</li>
                            <li> Business Class Seats : {flight.BusinessClassSeats}</li>
                            <li>Airport : {flight.Airport}</li>
                            <li>Arrival Terminal : {flight.ArrivalTerminal}</li>
                        </ul>
                    </div>

                }) : <h1>No Results Found</h1>
                }



            </div>

        )
    }
}



export default SearchResults;

这是组件的代码

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2021-11-26 22:58:34

变化

代码语言:javascript
运行
复制
    const [searchValues, setSearchValues] = useState({})

代码语言:javascript
运行
复制
    const [searchValues, setSearchValues] = useState([])

您没有将状态设置为加载数组。

票数 4
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/70130766

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档