getStaticPaths Next JS 中未定义的路径

Question

我正在尝试执行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 }
    }
  }
}

Answer 1

我看代码的猜测是getStaticPaths中的catch块正在被输入，并且由于它没有return语句，函数结束并默认返回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
  }
}

我不熟悉getStaticPaths API，因此您可能需要为paths 返回something（不是空数组）。因此，这段代码可能无法正常工作，但我只是指出您需要以您收到的错误消息中指定的形式返回一个对象。