Reactjs 未在NextJs中渲染道具

我在博客模型中有一个帖子页面，其中包括详细信息和评论组件。来自post页面的getStaticProps获取数据，我将此数据作为props传递给Detail组件。但是细节组件没有得到渲染

以下是帖子页面：

import BlogDetail from "../../components/BlogDetail/BlogDetail"
import { CSSTransition } from 'react-transition-group'
import AuthContextProvider from "../../context/AuthContext"
import Cookie from "../../components/Cookie"
import { ThemeContext } from "../../context/ThemeContext"
import { useContext } from "react"
import '@fortawesome/fontawesome-svg-core/styles.css'
import dynamic from 'next/dynamic'
const Navbar = dynamic(() => import("../../components/Navbar"), { ssr: false })
import axios from "axios"
import { baseURL } from "../../functions/baseUrl"

export const getStaticPaths = async () => {
    const res = await axios.get(baseURL + "/post/");
    const info = await res.data
    const paths = info.map(datum => {
        return {
            params: { slug: datum.slug }
        }
    })
    return {
        paths,
        fallback: false
    }
}
export const getStaticProps = async (context) => {
    const slug = context.params.slug;
    const res = await axios.get(baseURL + '/post/' + slug + "/");
    const data = await res.data;

    return {
        props: { datum: data }
    }
}
const Blog = (datum) => {
    const [dark] = useContext(ThemeContext)
    return (
        <div className={`main ${dark}`}>
            <AuthContextProvider>
                <Navbar />
                <CSSTransition
                    in={true}
                    classNames="pagetransitions"
                    timeout={100}
                    key={1}
                    appear={true}
                    unmountOnExit
                >
                    <div>
                        <Cookie />
                        <BlogDetail title={datum.title} datum={datum} />
                    </div>
                </CSSTransition>
            </AuthContextProvider>
        </div>
    )
}
export default Blog;

从“../../components/BlogDetail/BlogDetail”导入BlogDetail
从“反应转换组”导入{CSTranslation}
从“../../context/AuthContext”导入AuthContextProvider
从“../../components/Cookie”导入Cookie
从“./../context/ThemeContext”导入{ThemeContext}
从“react”导入{useContext}
导入“@fortawesome/fontawesome svg核心/styles.css”
从“下一个/动态”导入动态
const-Navbar=dynamic（（）=>import（“../../components/Navbar”），{ssr:false}）
从“axios”导入axios
从“./../functions/baseURL”导入{baseURL}
export const getstaticpath=async（）=>{
const res=wait axios.get（baseURL+“/post/”；
const info=等待恢复数据
常量路径=信息地图（基准=>{
返回{
参数：{slug:datum.slug}
}
})
返回{
路径，
后退：错误
}
}
导出常量getStaticProps=async（上下文）=>{
常量slug=context.params.slug；
const res=wait axios.get（baseURL+'/post/'+slug+“/”）；
常数数据=等待恢复数据；
返回{
道具：{datum:data}
}
}
const Blog=（数据）=>{
const[dark]=useContext（ThemeSecontext）
返回(
)
}
导出默认博客；

以及我的博客详细信息模型：

import React, { useState } from 'react';
import styles from "../../styles/blogDetail.module.css"
import timeformatter from "../../functions/timeFormatter"
import Tags from "../Tags";
import Head from "next/head"
import dynamic from 'next/dynamic'
const Favourite = dynamic(() => import("./Favourite"), { ssr: false })
const Comment = dynamic(() => import("./Comment"), { ssr: false })

function BlogDetail(props) {
  const data = useState(props.datum)

  function createMarkup() {
    return { __html: data.text };
  }
  return (
    <div className={styles.blog_text_container}>
        <div>
          <h1>{data.title}</h1>
          <Tags tag={data.tags} />
          {data.image_head === null ? (
            <span></span>
          ) : (
              <div className={styles.article_detail_image}>
                <img className={styles.blog_header_image_detail} alt={data.alt_image_text} src={data.image_head}></img>
              </div>
            )}
          <br></br>
          <div dangerouslySetInnerHTML={createMarkup()} />
          <br></br>
          <span>{data.comments}</span>
          <br></br>
          <span>Published: {timeformatter(data.created_at)}</span>
          <br></br><br></br>
          <Favourite id={data.id} favcount={data.favcount} /><br></br>
          <Comment id={data.id} /><br></br>
          <br></br>
        </div>
    </div>
  )
}
export default BlogDetail

import React，{useState}来自“React”；
从“../../styles/blogDetail.module.css”导入样式
从“../../functions/timeformatter”导入timeformatter
从“./Tags”导入标记；
从“下一个/头”导入头
从“下一个/动态”导入动态
const favorite=dynamic（（）=>import（“./favorite”），{ssr:false}）
const Comment=dynamic（（）=>import（“./Comment”），{ssr:false}）
功能详细信息（道具）{
常量数据=使用状态（道具数据）
函数createMarkup（）{
返回{uuuhtml:data.text}；
}
返回(
{data.title}
{data.image_head===null(
) : (
)}






{data.comments}



已发布：{timeformatter（data.created_at）}














)
}
导出默认博客详细信息

---

我试着单独传递我的道具，比如标题、文本。但是野田佳彦。我已经尝试过直接渲染道具而不包括状态。任何帮助都将不胜感激。

问题可能就在这里

// some code
const Blog = (datum) => {
// some code

到达

const Blog = ({datum}) => {
// your code

正如这里所解释的

---

在post page destructure dataum中

...other code remains same
const Blog = ({datum}) => {
...other code remains same

在博客详细信息页面

...other code remains same
function BlogDetail({datum : data}) { // destructuring dataum and naming it as data since  you have used data.* in your code 
  // you donot need useState here
...other code remains same