前端进阶5 - Nuxt.js - 7-NuxtJS错误页面、个性meta标签设置

7-NuxtJS错误页面、个性meta标签设置

• NuxtJS错误页面

  • layouts目录下，创建error.vue文件
  • 判断不同错误，显示

• 个性meta标签设置

  • 不同网页标题要不一样，不能nuxt.config.js的head的title里统一设置

    • 父组件传参数title，子组件data函数接收title:this.$route.params.title

    • head函数：在每个页面独立设置head内容的方法

      • title: this.title
      • meta: [{ hid: "description", name: "news1", content: "This is news page" }]

  • 注意：

    • 在seo当中，搜索引擎发现有两个content是不好的，会记录错误。
    • 必须覆盖掉之前的hid="description"
  • nuxt的好处之一：单独设置meta标签