为什么 useState() 没有设置默认值？

Question

我创建了以下 reactComponent。 据我了解 useState([]); 应该将 comments 变量设置为数组。 但事实并非如此。 我得到一个例外，我尝试在 object 上运行.map()。 我要做的是 Object.values(comments) 让它工作，但我不明白为什么。 我的 api 明确地返回一个评论对象数组。

import React, { useState, useEffect } from 'react';
import axios from 'axios';

export default ({ postId }) => {
  const [comments, setComments] = useState([]);

  const fetchData = async () => {
    const res = await axios.get(
      `http://localhost:4001/posts/${postId}/comments`
    );

    setComments(res.data);
  };

  useEffect(() => {
    fetchData();
  }, []);

  const renderedComments = comments.map(comment => {
    return <li key={comment.id}>{comment.content}</li>;
  });

  return <ul>{renderedComments}</ul>;
};

Answer 1

据我所知，您对 state 的使用是正确的，事实上Object.values对返回给您的数据有效，这意味着它绝对是一个Array.isArray(res.data)您的故障排除过程的一部分？

正如上面评论者所说，最有可能的情况是您从后端获得了 object。 您可以做的其他事情来确认它是否有错误地返回给您的数据是简单地注释掉您的useEffect并查看它是否仍然抛出相同的异常。