完善首页

接下来，让我们更新我们的首页（pages/index.js）。我们需要使用 Link 组件添加指向每个文章页面的链接。

打开 pages/index.js 并将以下导入添加到文件顶部，用于 Link 和 Date

import Link from 'next/link';
import Date from '../components/date';

然后，在同一文件的 Home 组件底部附近，用以下内容替换 li 标签

<li className={utilStyles.listItem} key={id}>
  <Link href={`/posts/${id}`}>{title}</Link>
  <br />
  <small className={utilStyles.lightText}>
    <Date dateString={date} />
  </small>
</li>

如果你访问 https://127.0.0.1:3000，页面现在将显示指向每篇文章的链接。

如果某些内容无法正常工作，请确保你的代码 如下所示。

就是这样！在我们结束本课之前，让我们在下一页讨论一些关于 动态路由 的技巧。