尽管能够控制台记录它，但无法在 react/next js 中获取数据

Question

我在这里使用 Next Js (React Js) 来开发我的 Web 应用程序，我还使用 graphql 从数据库中获取我的数据我也正在获取它但无法在屏幕上呈现它。我该怎么办！

import Link from 'next/link'
import moment from 'moment'

import {getRecentPosts , getSimilarPosts} from '../../services'

const PostWidget = ({categories , slug}) => {

    const [relatedPosts, setRelatedPosts] = useState([])

    useEffect(() => {
        if(slug){
            getSimilarPosts(categories, slug).then((result) => setRelatedPosts(result))
        }
        else{
            getRecentPosts().then((result) => setRelatedPosts(result))
        }
       
    }, [slug])
    return (
        <div>
            <h3>
                {slug ? "Related Posts" : "Recent Posts"}
            </h3>
            {relatedPosts.map((post) =>{
                <div key={post.slug}>
                    <div className="image">
                        <img 
                        src={post.featuredImage.url} 
                        alt="" />
                    </div>
                    <div className="content">
                        <p>{moment(post.createdAt).format('MMM DD, YYYY')}</p>
                        <h3>{post.title.toString()}</h3>
                    </div>
                </div>
            })}
        </div>
    )
}

export default PostWidget

当我 console.log(relatedPosts) 时，我能够获得 json 格式的数据，但是当我尝试像上面那样使用它时，我没有得到 post 信息，也不是能够在我的网页中显示我的数据

Answer 1

{relatedPosts.map((post) => (
                <div key={post.slug}>
                    <div className="image">
                        <img 
                        src={post.featuredImage.url} 
                        alt="" 
                        />
                    </div>
                    <div className="content">
                        <p>{moment(post.createdAt).format('MMM DD, YYYY')}</p>
                        <h3>{post.title}</h3>
                    </div>
                </div>
            ))}

因为我插入了{大括号}而不是（括号）： (post)=>{ code/JSX } ❌ 我们可以通过两种方式纠正这个问题： (post)=>{ return ( code/JSX )} ✔ 或 (post)=>( code/ JSX(react/next) ) ✔

尽管能够控制台记录它，但无法在 react/next js 中获取数据

Not able to fetch data in react/next js although able to console log it

json

console.log

reactjs

next.js