vue+vue-meta-info怎么动态设置meta标签


本篇内容主要讲解“vue+vue-meta-info怎么动态设置meta标签”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“vue+vue-meta-info怎么动态设置meta标签”吧!在写移动端项目的时候,通常都会设置meta禁止用户缩放。最近的需求中,个别页面允许用户缩放,就需要给不同的页面设置不同的meta了。但是vue是单页面应用,没办法向原生一样给每个页面设置不同的头信息。所以就需要借助到vue-meta-info了。vue-meta-info 是一个基于vue 2.0的插件,它会让你更好的管理你的 app 里面的 meta 信息。你可以直接 在组件内设置 metaInfo 便可以自动挂载到你的页面中。如果你需要随着数据的变化,自动更新你的title、meta等信息,那么用此 插件也是再合适不过了。当然,有时候我们也可能会遇到让人头疼的SEO问题,那么使用此插件配合 prerender-spa-plugin 也是再合适不过了vue-m免费云主机域名eta-info官网在main.js中全局引入在组件内静态使用需要注意的是:vue-meta-info并不是直接改变页面的meta信息,而是在下面追加一条覆盖上面的,如下图:所以只为某一个页面设置了,会影响别的页面的。就需要根据路由切换来动态设置了。在App.vue中监听路由变化如果需要改动的页面太多,比如要做seo,给页面设置keywords和description的。也可以在router中配置,结合vuex去设置更加优雅一点把。到此,相信大家对“vue+vue-meta-info怎么动态设置meta标签”有了更深的了解,不妨来实际操作一番吧!这里是百云主机网站,更多相关内容可以进入相关频道进行查询,关注我们,继续学习!

相关推荐: go语言的数据类型有什么用

这篇文章主要讲解了“go语言的数据类型有什么用”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“go语言的数据类型有什么用”吧! go语言是谷歌2009发布的开源编程语言。Go语言最初由Google公司的Rober…

免责声明:本站发布的图片视频文字,以转载和分享为主,文章观点不代表本站立场,本站不承担相关法律责任;如果涉及侵权请联系邮箱:360163164@qq.com举报,并提供相关证据,经查实将立刻删除涉嫌侵权内容。

(0)
打赏 微信扫一扫 微信扫一扫
上一篇 04/21 11:49
下一篇 04/21 16:00

相关推荐