0

我想展示来自 JSON 的 3 个产品。我正在尝试做一个 NextJS Web 应用程序。我只是在学习,当我复制教程时一切都是正确的,但我正在做自己的更改,并尝试创建不同的东西,但它不起作用。

谢谢大家!

 [
  {
    "id": "price_1JDUeIIpi9NgmDuQlNYIwAlP",
    "title": "HarryPotter1",
    "category": "Cuento",
    "image": "/images/harrypotter1.jpeg",
    "price": 20
  },
  {
    "id": "price_1JDUe4Ipi9NgmDuQh9nA4B9E",
    "title": "Harry Potter2",
    "category": "Novela",
    "image": "/images/harrypotter2.jpeg",
    "price": 10
  },
  {
    "id": "price_1JDUdqIpi9NgmDuQGOQO9HGj",
    "title": "Harry Potter3",
    "category": "Ensayo",
    "image": "/images/harrypotter3.jpeg",
    "price": 25
  }
] 
]

在不同的路线与Link。这是我的 [productId].js 文件的最后一部分:

export async function getStaticProps({ params = {} }) {
  const product = products.find(({ id }) => `${id}` === `${params.productId}`);
  return {
    props: {
      product
    },
  };
}

export async function getStaticPaths() {
  const paths = products.map((product) => {
    const { id } = product;
    return {
      params: {
        productId: id,
      },
    };
  });

  return {
    paths,
    fallback: false
  };
}

我从 Chrome 获取:错误:在 getStaticPaths 中未将必需参数 (productId) 作为字符串提供 /products/[productId]

4

1 回答 1

1

我只能根据错误描述假设:

const { id } = product;
    return {
      params: {
        productId: id,
      },
    };

getStaticPaths函数的这一部分中,您应该将idforproductId作为字符串提供(可能是一个单独的数字)。因此,您可能想尝试将其更改为:

const { id } = product;
    return {
      params: {
        productId: id.toString(),
      },
    };

让我知道这是否是您想要的。

于 2021-07-29T14:37:29.503 回答