我正在使用Reactjs/Nextjs，我试图使用“Axios”获取数据，在“API url”数据正在获取/显示，但在我的网页显示“还没有记录”，我错在哪里？以下是我当前的代码

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

function Displaydata() {
      const [posts,setPosts]=useState([]);

useEffect(()=>
{
    const getdata=async()=>
    {
        const { data: res } = await axios.get(
            "xxxxxxxxxxxxxxxxxxxx/api/Allvideo"
          );
          console.log(res);
          setPosts(res);
    };
})
return(
    <div>
        {posts?.length ? posts.map((product: { id: any; link: any; }) => <p key={product.id}>
        {product.id}-{product.link}</p>) 
            : <h3>There are no records yet</h3>}
            </div>
    )
}

export default Displaydata