NextJS - 无法获取单个项目答案

【问题标题】：NextJS - Cant fetching a Single ItemNextJS - 无法获取单个项目
【发布时间】：2022-09-26 14:51:56
【问题描述】：

我无法获取单个项目，NextJS

const PRODUCT_API_BASE_URL = \"http://localhost:8080/api/v1/products/\";

export const getStaticPaths = async () => {
    const res = await fetch(PRODUCT_API_BASE_URL);
    const data = await res.json();
    const paths = data.map(product => {
        return {
            params: {
                id: product.id.toString()
            }
        }
    })
    return {
        paths,
        fallback: false
    }
}

export const getStaticProps = async (context) => {
    const id = context.params.id;
    const res = await fetch(PRODUCT_API_BASE_URL + id);
    const data = await res.json();

    return {
        props: { product: data }
    }
}

const ProductDetail = ({ product }) => {
    return (
        <>
            {product.nameProduct}
        </>
    )
}

export default ProductDetail

标签： javascript reactjs next.js nextjs-dynamic-routing

【解决方案1】：

名称 id 与 productId 不匹配。这应该解决它：

const paths = data.map(product => {
    return {
        params: {
            productId: product.id.toString()
        }
    }
})

【讨论】：