首页 > Web开发 > 详细

【转】vue中动态设置meta标签和title标签

时间:2018-07-10 22:29:37      阅读:222      评论:0      收藏:0      [点我收藏+]

因为和原生的交互是需要h5这边来提供meta标签的来是来判断要不要显示分享按钮,所有就需要手动设置meta标签,标题和内容

//router内的设置
{
      path: ‘/teachers‘,
      name: ‘TDetail‘,
      component: TDetail,
      meta: {
        title:"教师详情",
        content: ‘disable‘
      }
    },
    {
      path: ‘/article‘,
      name: ‘Article‘,
      component: Article,
      meta: {
        title: "文章详情",
        content: ‘disable-no‘
      }
    },
  //main.js里面的代码
  router.beforeEach((to, from, next) => {
  /* 路由发生变化修改页面meta */
  if(to.meta.content){
    let head = document.getElementsByTagName(‘head‘);
    let meta = document.createElement(‘meta‘);
    meta.content = to.meta.content;
    head[0].appendChild(meta)
  }
  /* 路由发生变化修改页面title */
  if (to.meta.title) {
    document.title = to.meta.title;
  }
  next()
});

 转自:https://blog.csdn.net/qq_29515037/article/details/79475068

 

【转】vue中动态设置meta标签和title标签

原文:https://www.cnblogs.com/yunspider/p/9291765.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!