码迷,mamicode.com
首页 > Web开发 > 详细

vue seo管理 vue-meta-info

时间:2018-03-24 17:28:04      阅读:652      评论:0      收藏:0      [点我收藏+]

标签:set   content   gen   inf   新闻   return   mount   bsp   使用   

      vue-meta-info:
         安装:

                npm install vue-meta-info --save
         全局引入vue-meta-info,在main.js
                import Vue from ‘vue‘
                import MetaInfo from ‘vue-meta-info‘
                Vue.use(metaInfo)
         组件内静态使用metaInfo
               <script>
                    export default {
                             metaInfo: {
                                  title: ‘新闻页面‘,
                                  meta: [{
                                       name: ‘keyWords‘,
                                       content: ‘新闻‘
                                   }]
                                }
                              }
                 </script>
如果你的title或者meta不是静态的,是需要异步加载的::用metaInfo() 方法
    <script>
       export default {
              name: ‘async‘,
                     metaInfo() {
                            return {
                                title: this.pageName
                             }
                      },
            data() {
                 return {
                      pageName: ‘loading‘
                  }
             },
            mounted (){
                   setTimeout(() => {
                       this.pageName = ‘async‘
                   },2000)
             }
        }
</script>

vue seo管理 vue-meta-info

标签:set   content   gen   inf   新闻   return   mount   bsp   使用   

原文地址:https://www.cnblogs.com/wangyanhua95/p/8639670.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!