小编Nei*_*ler的帖子

我正在尝试使用 [slug].js 通过 getStaticProps 和 getStaticPaths 呈现与 index.js 相邻的页面。使用动态路由导航到页面后，出现不匹配错误。即使提供的路径实际上与页面 slug 和页面道具内容匹配，也会发生此错误。

当 index.js 被复制并重命名为 page-name.js（例如“about.js”）时，页面呈现良好，所以我相信问题在于我如何使用 getStaticPaths。实际上，我并没有完全理解 getStaticProps 和 getStaticPaths 之间的关系。是否有一些映射允许引擎根据地图中的任何路径查找适当的道具？

索引.js

import Link from 'next/link';
import { getPageDataBySlug } from '../lib/api';

export default function Page(pageData) {
  const page = pageData;
  return (
    <>
      <h1>document title is: {page.documentTitle}</h1>
      <Link href="/[slug]" as="/about">
        <a>
          <h5>Link to About</h5>
        </a>
      </Link>
    </>
  );
}

export async function getStaticProps() {
  const props = await getPageDataBySlug('home');
  return {
    props
  };
}

[slug].js

import Link from 'next/link';
import …