React/MaterialUI - 类型错误:无法读取未定义的属性“地图”

时间:2021-02-10 00:22:21

标签: javascript reactjs

我的映射函数最初工作到几秒钟前,现在我不断收到标题中最初提到的错误。我如何为下面的案例解决这个问题?

 export default function Graph()
 {
     const { slug } = useParams();
     const [data, setData] = useState([]);

    useEffect(() => {
        axiosInstance.get('bucket/' + slug + '/').then((res) => {
            setData(res.data);
            console.log(res.data.stock_list);
        });
     }, [setData, slug]);

    

     return (
         <Container>
             <Grid>
             <Paper>
                 <List dense component="div" role="list">
                 {data.stock_list.map((value) => {
                    return (
                        <ListItem role="listitem">
                            {value}
                        </ListItem>
                    );
                    })}
                </List> 
             </Paper>
             </Grid>
         </Container>
    ); 
 }

1 个答案:

答案 0 :(得分:2)

data.stock_list 在第一次渲染时未定义,因为您将其初始化为 []。你可以改成

    const [data, setData] = useState(); 
    ...
    {
      data?.stock_list?.map(value => <ListItem role="listitem">{value}</ListItem>)
    }

这样它就不会继续,除非定义了 data.stock_list。