用户登录

在项目里新建了 app 目录以后,Next 框架会自动在 app 的根目录的下面生成一个 head 文件,这个文件可以配置页面的

标签里的东西。

这个文件里定义的就是一个 React 组件,在这个文件里用了一组 fragment,它里面使用了 title,meta 还有一个 link 元素,这些东西都会放在页面的

元素里面。

我们在这个 title 元素里可以设置一下页面的标题,比如“宁皓网”。

观察一下应用的首页,你会发现在浏览器标签上显示的页面的标题现在就会是“宁皓网”。

查看一下页面的源代码,我们可以在

元素里面,找到一组 元素,中间的值就是“宁皓网”。 <p>访问一下 /about 这个页面,这个页面的标题同样会是“宁皓网”。</p> <p>如果想要定制一下当前这个页面的页面标题,我们可以在 app/about 目录的下面,再新建一个 head.tsx 文件,在里面定义一个组件,组件的名字是 Head。设置一下组件的视图,一组 Fragment,里面添加一组 title 标签,内容是 “关于 - 宁皓网”。</p> <p>再观察一下关于这个页面的页面标题,现在就会变成 关于 - 宁皓网。也就是在 app/about 目录里的 head 这个文件里定义的组件里面,用 title 标签设置的页面标题内容。</p>

定制 Next 页面的头部(Head)《 Next.js:快速起步 》

统计

14696
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点