我是否需要在 Next.JS 应用程序的每个文件中使用 getStaticPaths？

编程问答 2022-05-30

问题描述

我正在制作 Next.JS 静态电子商务网站。

我有一个单独的产品页面的 /products/[id] 路径，所以在 [id].js 文件中我有 getStaticPaths 函数，它为我的所有产品创建页面。所以没关系。

现在我正在为我的产品（如裤子、T 恤等）制作系列，所以我做了 /categories/[category] 路径。在 [category].js 中，我想显示特定系列的所有产品。

现在是一个问题！ [category.js] 中静态呈现的产品是否需要 getStaticPaths 函数，或者我可以在 getStaticProps 中获取它们并在页面上使用？

我写了一些运行良好的代码，但我不知道它是否正确。代码如下。

首先我调用 getStaticPaths 为每个集合（类别）生成单独的页面：

export async function getStaticPaths() {
    await dbConnect()

    const categories = await CategoryModel.find({})

    const paths = categories.map((doc) => {
        const category = doc.toObject()
        return {
            // !!! categories finds by name (not slug or id)
            params: { category: category.name }
        }
    })

此外，我使用 getStaticProps 来获取特定的集合（类别）和产品。

export async function getStaticProps({ params }) {
    await dbConnect()

    const category = await CategoryModel.findOne({ name: params.category }).lean()
    category._id = category._id.toString()
    
    const productsData = await ProductModel.find({categories: `/${params.category}`})
    const products = productsData.map((doc) => {
        const product = doc.toObject()
        product._id = product._id.toString()
        return product
    })

    // revalidate set the time (in sec) of re-generate page (it imitate SSR)
    return { props: { category,products },revalidate: 120 }
}

所以这里我没有对产品使用 getStaticPaths，因为我在 products/[id].js 中创建了它们。方法正确吗？

提前致谢！

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

getstaticpathsgetstaticpropsreactjsreactjsssg