时间戳

首页 > 解决方案 > getStaticPaths Next JS 中未定义的路径

reactjs - getStaticPaths Next JS 中未定义的路径

问题描述

我正在尝试做getStaticPaths，getStaticProps但我总是收到一个错误，paths即getStaticPaths. 下一个版本目前正在上10.0.3。

这是错误信息

Error: Invalid value returned from getStaticPaths in /properties/[id]. Received undefined Expected: { paths: [], fallback: boolean }

这是我的代码

export async function getStaticPaths() {
  try {
    const properties = await api.get('/properties', {
      headers: generateAuthHeaders(null, 'application/json', API_TOKEN)
    })

    const paths = properties.res.data.propertyDetails.map(value => {
      return {
        params: { id: value.id }
      }
    })

    return { paths, fallback: false }
  } catch (er) {
    //  do nothing
  }
}

export async function getStaticProps({ params }) {
  try {
    const properties = await api.get(`/properties/${params.id}`, {
      headers: generateAuthHeaders(null, 'application/json', API_TOKEN)
    })

    return {
      props: {
        propertyDetails: JSON.parse(JSON.stringify(properties.data.properties))
      }
    }
  } catch (er) {
    return {
      props: { propertyDetails: false }
    }
  }
}

标签： reactjsnext.jsvercel

解决方案

我看代码的猜测getStaticPaths是正在输入 catch 块，并且由于它没有返回语句，因此函数undefined默认结束并返回。

所以你需要返回一些东西，就像这样......

export async function getStaticPaths() {
  try {
    const properties = await api.get('/properties', {
      headers: generateAuthHeaders(null, 'application/json', API_TOKEN)
    })

    const paths = properties.res.data.propertyDetails.map(value => {
      return {
        params: { id: value.id }
      }
    })

    return { paths, fallback: false }
  } catch (er) {
    console.error(er)
    return { paths: [], fallback: false } // <- ADDED RETURN STMNT
  }
}

我不熟悉APIgetStaticPaths，因此您可能需要为. 所以这段代码可能不起作用，但我只是指出您需要以您收到的错误消息中指定的形式返回一个对象。paths

推荐阅读