Javascript React JS Map TypeError:无法读取属性';地图';未定义的

Javascript React JS Map TypeError:无法读取属性';地图';未定义的,javascript,node.js,reactjs,axios,Javascript,Node.js,Reactjs,Axios,我正在从事一个MERN项目,我正处于与Axios进行前端和后端集成的级别。然而,我面临着一些问题。在我的大多数列表屏幕中,我都面临此错误: TypeError: Cannot read property 'map' of undefined 这是我用于map函数的代码: const carList = useSelector((state) => state.carList) useEffect(() => { if (!adminInfo

我正在从事一个MERN项目,我正处于与Axios进行前端和后端集成的级别。然而,我面临着一些问题。在我的大多数列表屏幕中,我都面临此错误:

TypeError: Cannot read property 'map' of undefined 
这是我用于map函数的代码:

      const carList = useSelector((state) => state.carList)


    useEffect(() => {
        if (!adminInfo) {
             history.push('/admin/login')
         }
        dispatch(listCars('', pageNumber))
    }, [
        dispatch,
        history,
        pageNumber,
    ])

        const { loading, error, cars, page, pages } = carList

return(
                                <tbody>
                                    {cars.map((car) => (
                                        <tr key={car._id}>
                                            <td>{car.companyId}</td>
                                            <td>{car.carPlate}</td>
                                            <td>{car.carModel}</td>
                                            <td>{car.color}</td>
                                            <td>{car.totalMileage}</td>
                                            <td>{car.status}</td>
                                            <td>{car.registrationDate}</td>
                                        </tr>
                                    ))}
                                </tbody>
)
减速器代码:

export const carListReducer = (state = { cars: [] }, action) => {
    switch (action.type) {
        case CAR_LIST_REQUEST:
            return { loading: true, cars: [] }
        case CAR_LIST_SUCCESS:
            return {
                loading: false,
                cars: action.payload.cars,
                pages: action.payload.pages,
                page: action.payload.page,
            }
        case CAR_LIST_FAIL:
            return { loading: false, error: action.payload }
        default:
            return state
    }
}

这样做的目的是在数据库中循环浏览汽车并显示它们。同样,这个问题也发生在每个地图功能中,无论是汽车还是其他什么。仅供参考,该API已通过Postman测试,运行良好。

在尝试循环并呈现之前,请确保已获取API数据。试着这样做:

 {cars ? cars.map((car) => (
           <tr key={car._id}>
               <td>{car.companyId}</td>
               <td>{car.carPlate}</td>
               <td>{car.carModel}</td>
               <td>{car.color}</td>
               <td>{car.totalMileage}</td>
               <td>{car.status}</td>
               <td>{car.registrationDate}</td>
           </tr>
                  )) : ''}
{cars?cars.map((car)=>(
{car.companyId}
{car.carPlate}
{car.carModel}
{car.color}
{汽车总里程数}
{car.status}
{car.registrationDate}
)) : ''}

我不知道这是否是一个答案,但它为我解决了问题。因此,最初在Axios请求中,它检索有效负载中的数据。但是,我指定了要保存的有效负载中的内容,这对我很有用

dispatch({
    type: CAR_LIST_SUCCESS,
    payload: data.car,
})

这对我来说很好

谢谢你的回复。看起来这些车不是从API中获取的,这是有原因的。另外,我认为我的Axios调用是正确的,这意味着问题出在API中。但是,我用Postman测试了API,它工作正常,这让我很困惑!!
dispatch({
    type: CAR_LIST_SUCCESS,
    payload: data.car,
})