首页 > 解决方案 > map 不是 react js 中的函数

问题描述

试图映射此响应,但即使我放入usestate数组中,它也向我显示错误。请仔细阅读我的代码,看看您是否可以修复错误..

function Comment() {
    const [comment_data, setcomment_data] = useState([]);
    useEffect(() => {
        const query = `
    query{
        forumAnswerId(id:1){
        forumAnswerBody
        forumAnswerTime
        forumAnswerCode1
        forumAnswerCode2
        forumAnswerCode3
        forumAnswerAuthor
        forumAnswerBoolean
        forumAnswerCode1Title
        forumAnswerCode2Title
        forumAnswerCode3Title
        }
        forumComment(forumAnswerComment:1){
                forumAnswerCommentPost
                forumAnswerCommentBody
                forumAnswerCommentAuthor
                forumAnswerCommentTime  
        }
        }
`;
        const opts = {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({ query }),
        };
        const res = fetch('http://127.0.0.1:8000', opts)
            .then((res) => res.json())
            .then((r) => setcomment_data(r));
    }, [])
    const map = comment_data.map((e) => {
        return (
            <>
                {comment_data.map((inner) => (
                    <>
                        {inner.data?.forumAnswerId?.map((data) => (
                            <></>
                        ))}
                    </>
                ))}
            </>
        );
    });
    console.log(comment_data);
    return (
        <div>
            {map}
        </div>
    );
}

API结构

在此处输入图像描述

我使用了一个useEffect钩子来加载数据并将数据存储在状态变量中并访问它。

标签: javascriptreactjs

解决方案


如果我很好地理解了您的 api 的响应,那么您获取的不是数组。它是一个具有属性的对象,data这就是comment_data. 所以不行comment_data.map()


推荐阅读