版本.React：18.2.0React路由器Dom：6.4.3 @类型/React-路由器-Dom：5.3.3打印稿：4.9.3
目的是通过动态路由只显示页面所需的数据。enter image description here
尝试使用Map重复console.log中的数据，但无法正常工作。
我需要在这里修复什么？

import axios from "axios"
import { useState, useEffect } from "react"
import { useParams } from "react-router-dom"
interface ITypes {
    id: number;
    title: string;
    subDescription: string;
    description: string;
}
function Detail() {
    const params = useParams()
    const [data, setData] = useState([])
    useEffect(() => {
        axios.get(`http://localhost:8001/post/${params.id}`)
        .then((res) => setData(res.data))
    } , [])
    
    return (
        <div>
            {data.length >= 0 && data.map((Td:ITypes) => (
                <div key={Td.id}>   
                 <p>{Td.id}</p> <<<< 
                 <p>{Td.title}</p> <<< I want to repeat this part, but only white screen is rendered.
                </div>
            ))} 
        </div>
    )
}
export default Detail