reactjs - getServerSideProps() 未使用组件运行

Question

我正在使用 Next.js 制作一个小型 Web 应用程序，但我不知道为什么，但是getServerSideProps()当我使用该组件时它没有运行。我以前在 中的页面上有以下代码/pages，但我将其移动以用作组件。

export const getServerSideProps = async () => {
  console.log("in getServerSideProps") // never shows
  let bans = await fetch('http://localhost:3000/api/get_bans').then((res) => {
    return res.json();
  })

  return {
    props: { bans: bans }
  }

}

const BansList = (listName, bans) => {
  
  bans = bans.bans
  console.log(bans) // undefined
  
  return (
    <h1>test</h1>
  )

}

我已经剥离了代码以轻松显示问题所在。当我使用它作为一个组件getServerSideProps没有运行时，bans总是未定义。

标签： reactjsnext.js

Answer 1

getServserSideProps仅适用于页面级别，不适用于组件级别。您必须在下使用页面组件pages/

更多信息：https ://nextjs.org/docs/basic-features/data-fetching#getserversideprops-server-side-rendering