Reactjs 在react.js的条形图中获取错误&unfined是不可迭代的

我在条形图中得到了一个错误"未定义的不可迭代"！

我从API得到的回应是

{
  "saleCharts": [
    {
      "priceSum": 0,
      "categoryName": "string"
    }
  ],
  "statusCharts": [
    {
      "qtySum": 0,
      "status": "string"
    }
  ]
}

我在Reaction中编写的代码是:

function Dashboard({ notifyData }) {

    const [orderData, setOrderData] = useState([]);
    const [dashboardData, setDashboardData] = useState([]);
    const [newOrderCount, setNewOrderCount] = useState(0);

    useEffect(() => {

        getNewOrder();
    }, [notifyData]);

    var getNewOrder = function () {
        let orderResp = [];
        axios.get(GetNewOrdersUrl + '/2').then(response => {
            orderResp = response.data;
        })
            .then(() =>
                axios.get(OrderDashboardUrl).then(response => {
                    setOrderData(orderResp.orderList);
                    setNewOrderCount(orderResp.count);
                    setDashboardData(response.data.saleCharts);

                }))
    };
}
return (
    <>
        <BarChart
            xAxis={[
                {
                    id: 'barCategories',
                    data: dashboardData.map(item => item.categoryName),
                    scaleType: 'band',
                },
            ]}
            series={[
                {
                    data: dashboardData.map(item => item.priceSum),
                },
            ]}
            colors={['#d75b47']}
            width={1000}
            height={350}
        />
    </>
)

请告诉我为什么会有这样的问题.我所了解的是，我的条形图是先绘制后，请国家提供解决方案.