美文网首页
2019-07-14简单设置Nuxt.js中meta内容

2019-07-14简单设置Nuxt.js中meta内容

作者: Kason晨 | 来源:发表于2019-07-14 16:57 被阅读0次

    Nuxt.js 依据 pages 目录结构自动生成 vue-router 模块的路由配置。
    路由的配置可以参考官方的文档
    官方文档

    动态路由参数校验

    进入一个页面,对参数传递的正确性校验是必须的,Nuxt.js也贴心的为我们准备了校验方法 validate( )。

    export default {
     
      validate ({ params }) {
        // 必须为全数字
        return /^\d+$/.test(params.newsId)
      }
     
    }
    

    单个组件meta设置

    通过路由传过来的 title ; 在head方法里边配置;注意 hid 的值要与nuxt.config.js 里边的一样,要不然会重复创建,对搜索引擎不友好

    export default {
        data () {
            return  {
                title: this.$route.params.title
            }
        },
        head () {
            return {
                title: this.title,
                meta: [
                    { hid: ‘description‘, name: ‘description‘, content: ‘hi-Sen‘ }
                ]
            }
        }
    }
    

    相关文章

      网友评论

          本文标题:2019-07-14简单设置Nuxt.js中meta内容

          本文链接:https://www.haomeiwen.com/subject/zycikctx.html