javascript - 在组件中使用 getStaticProps

Question

我用下一个 js 和 typescript 开始了一个项目。我有一个主组件，我在 index.js 页面中调用它 我在主组件中使用 getStaticProps 函数 getStaticProps 返回一个 Prop 对象，当我在我的主组件中记录这个 Prop 时，我在控制台中收到 undefined 。
我想知道在组件中使用 getStaticProps 是错误的，我只需要在页面中使用该功能即可。
我是下一个 js 的新手，如果有人能帮助我，我将不胜感激。
这是我的主要组成部分

import React from 'react';
import {IMain} from "../../../../interfaces/components/IMenu/IMain";

const Main:React.FC<IMain> = (props) => {
    console.log(props);
    return (
        <div>
        </div>
    );
};


export async function getServerSideProps() {
    return {
        props: {
            data: 'gg'
        }
    };
}

export default Main;

这是我的 index.js 页面

import Text from "./../components/ui/Text/Text";
import Button from "../components/ui/Button/Button";
import Main from "../components/Menu/Desktop/Main/Main";

const Home = () => {
  return <Main/>;
};




export default Home;

Answer 1

getStaticProps 只能从页面导出。你不能从非页面文件中导出它。如果你将getStaticProps添加为页面组件的属性，它将不起作用。
https://nextjs.org/docs/basic-features/data-fetching