vue动态给网站每个页面添加title 关键词 描述方法

1.在路由里面title 关键词 描述

// 路由懒加载
const _import = file => () => import('@/views/' + file + '/index.vue')

const routes = [
  {
    path: '/',
    name: 'home',
    component: _import('home'),
    meta:{
      title:'专业灵活用工_大数据智能匹配共享经济平台-钇活儿',
      content:{
        keywords:'钇活儿用工,灵活用工,税收优惠,共享经济,劳务派遣,钇活儿',
        description:'钇活儿为企业提供灵活用工、税收优惠、共享经济、劳务派遣等解决方案。钇活儿SaaS级、PaaS级灵活用工管理平台通过整合“人才”和“企业”双方的供求关系，让人才可以足不出户就业，也为企业解决了灵活用工面临的法律风险。'
      }
    }
  },
  {
    path: '/product',
    name: 'product',
    component: _import('product'),
    meta:{
      title:'钇活儿为企业提供灵活用工、税收优惠、共享经济、劳务派遣等解决方案。钇活儿SaaS级、PaaS级灵活用工管理平台通过整合“人才”和“企业”双方的供求关系，让人才可以足不出户就业，也为企业解决了灵活用工面临的法律风险。',
      content:{
        keywords:'钇活儿为企业提供灵活用工、税收优惠、共享经济、劳务派遣等解决方案。钇活儿SaaS级、PaaS级灵活用工管理平台通过整合“人才”和“企业”双方的供求关系，让人才可以足不出户就业，也为企业解决了灵活用工面临的法律风险。',
        description:'钇活儿为企业提供报酬代发、企业降本增效、个体经营个税等解决方案。钇活儿SaaS级、PaaS级灵活用工管理平台通过整合“人才”和“企业”双方的供求关系，让人才可以足不出户就业，也为企业解决了灵活用工面临的法律风险。'
      }
    }
  },
  {
    path: '/solution',
    name: 'solution',
    component: _import('solution'),
    meta:{
      title:'众包模式_共享经济用工模式-钇活儿',
      content:{
        keywords:'众包模式,共享经济用工模式',
        description:'钇活儿为企业提供众包模式,共享经济用工模式等解决方案。钇活儿SaaS级、PaaS级灵活用工管理平台通过整合“人才”和“企业”双方的供求关系，让人才可以足不出户就业，也为企业解决了灵活用工面临的法律风险。'
      }
    }
  },
  {
    path: '/about',
    name: 'about',
    component: _import('about'),
    meta:{
      title:'关于钇活儿-钇活儿靠谱吗-钇活儿',
      content:{
        keywords:'关于钇活儿-钇活儿靠谱吗-钇活儿',
        description:'钇活儿为企业提供优质的灵活用工解决方案。钇活儿SaaS级、PaaS级灵活用工管理平台通过整合“人才”和“企业”双方的供求关系，让人才可以足不出户就业，也为企业解决了灵活用工面临的法律风险。'
      }
    }
  }
]

2.在main.js用beforeEach判断

//前置守卫
router.beforeEach((to, from, next) => {
    if (to.meta.content) {
        let head = document.getElementsByTagName('head');
        let meta = document.createElement('meta');
        document.querySelector('meta[name="keywords"]').setAttribute('content', to.meta.content.keywords)
        document.querySelector('meta[name="description"]').setAttribute('content', to.meta.content.description)
        meta.content = to.meta.content;
        head[0].appendChild(meta)
    }
    if (to.meta.title) {
        document.title = to.meta.title;
    }
    next()
});