Next.js - 如何將 id 從查詢傳遞到 getInitialProps 函數

Question

我想用db中的文章建立一個簡單的網站。 我的問題是我需要使用服務器呈現這些文章，我可以使用 Next.js 文檔中的getInitialProps函數來完成： https ://nextjs.org/docs/api-reference/data-fetching/getInitialProps#getinitialprops-for -older-versions-of-nextjs

現在它工作正常，但我想通過它的 ID 實現獲取文章，我的鏈接應該是這樣的：

http://localhost:3000/articles/<some_id>

我已經這樣做了，但現在我想讀取該 ID 並將其傳遞給 getInitialProps 函數，以便僅為一篇特定文章調用我的 API。 我的問題是我不知道如何傳遞router道具以從查詢和調用 API 中獲取該 ID。

import { withRouter } from "next/router";
import fetch from "isomorphic-unfetch";

const Article = ({ router }) => {
  console.log(router);
  return (
    <div>
      <h1>Hello World</h1>
    </div>
  );
};

Article.getInitialProps = async props => {
  console.log(props);
  const res = await fetch(
    `https://admin.jozefrzadkosz-portfolio.pl/articles/${router.query.id}`
  );
  const articles = await res.json();
  return { articles };
};

export default withRouter(Article);

Answer 1

getInitialProps作為參數context對象獲取，該對象上有query 。

你應該在那里得到你的價值。