Next.js v12中getServerSideProps异常：props.data返回undefined求助

排查点1：修复组件的语法错误 #

你的Page组件类型定义存在语法错误，{data: any) 缺少闭合大括号，这会导致组件无法正确解构传入的props。修正后代码如下：

export default function Page({data}: {data: any}) {
    console.log('p', data);
    return <DetailsForm data={data} name="abc"/>
}

排查点2：简化getServerSideProps的写法 #

原写法虽语法可行，但标准async函数写法更清晰，可避免潜在歧义：

export const getServerSideProps = async (context: any) => {
  const name = context.query.name;
  const response = await fetchDetails(name);
  const data = response.data;
  console.log(data); // 服务端正常打印数据
  return { props: { data } };
};

排查点3：验证fetchDetails的返回结构 #

若上述修正后问题仍存在，检查fetchDetails的返回值是否确实包含data字段。可在服务端打印完整response对象确认结构：

console.log('完整response:', response);

排查点4：确认页面路由的访问方式 #

确保访问页面时query.name参数已正确传递，比如通过/details?name=xxx的方式访问，避免因参数缺失导致fetchDetails返回空数据。

内容的提问来源于stack exchange，提问作者manojadams