分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 前端开发

vue seo管理 ?vue-meta-info

发布时间:2023-09-06 01:46责任编辑:董明明关键词:meta

      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

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

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved