因为和原生的交互是需要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标签的更多相关文章

  1. vue中动态设置echarts画布大小

    document.getElementById('news-shopPagechart').style.height = this.heightpx2+'px'; //heightpx2定义在data ...

  2. vue中select设置默认选中

    vue中select设置默认选中 一.总结 一句话总结: 通过v-model来:select上v-model的值为option默认选中的那项的值(value) 二.select设置默认选中实例 < ...

  3. 分别在javascript和JSP中动态设置下拉列表默认值

    一.JavaScript中动态设置select标签中<option>选项的默认值: 比如,要完成下边这个下拉列表的动态显示,并且当进行前后翻页时,下拉列表中的值自动更新为当前页码: 图1 ...

  4. Vue.之. 动态设置按钮Disabled

    Vue.之. 动态设置按钮Disabled 按钮代码如下: 添加了一个 属性      :disabled="isAble"  ,控制:更新按钮.重置按钮 <el-form- ...

  5. vue中动态引入图片为什么要是require, 你不知道的那些事

    相信用过vue的小伙伴,肯定被面试官问过这样一个问题:在vue中动态的引入图片为什么要使用require 有些小伙伴,可能会轻蔑一笑:呵,就这,因为动态添加src被当做静态资源处理了,没有进行编译,所 ...

  6. Quartz在Spring中动态设置cronExpression (spring设置动态定时任务)

    什么是动态定时任务:是由客户制定生成的,服务端只知道该去执行什么任务,但任务的定时是不确定的(是由客户制定).      这样总不能修改配置文件每定制个定时任务就增加一个trigger吧,即便允许客户 ...

  7. Vue 中动态添加class(使用v-bind:class)

    今天在Vue中动态修改类名,元素的样式就是不改变,类名也没有加上去,里面的问题具体我还是不太清楚,有可能是因为自己不认真,把 :class= 后面的内容的格式给整错了,下面将正确的做法记录一下,便于以 ...

  8. Quartz在Spring中动态设置cronExpression

    什么是动态定时任务:是由客户制定生成的,服务端只知道该去执行什么任务,但任务的定时是不确定的(是由客户制定). 这样总不能修改配置文件每定制个定时任务就增加一个trigger吧,即便允许客户修改配置文 ...

  9. vue中动态添加div

    知识点:vue中动态添加div节点,点击添加,动态生成div,点击删除,删除对应的div,其中数组的长度是动态改变的,如在from表单中应用,直接在提交方法中,获得list,获取所填的元素即可 效果: ...

随机推荐

  1. JAVA基础之复识二

    JAVA语言 未经本人允许禁止转载或使用 基础知识:JAVA数据类型,运算符,流程控制等 注释: // 单行注释 /* 多行连续注释 ... */ /** 文档注释,该类型的注释会生成一个html文件 ...

  2. Echarts 修改字体样色 X、Y轴

    1.雷达图修改字体颜色 polar: [ { name:{ show: true, formatter: null, textStyle: { //设置颜色 color: '#109cad' } }, ...

  3. 基因组与Python --PyVCF 好用的vcf文件处理器

    vcf文件的全称是variant call file,即突变识别文件,它是基因组工作流程中产生的一种文件,保存的是基因组上的突变信息.通过对vcf文件进行分析,可以得到个体的变异信息.嗯,总之,这是很 ...

  4. 【转】Windows下selenium+python自动化测试环境搭建

    原文链接:http://www.cnblogs.com/test-of-philosophy/articles/4322918.html 搭建平台:windows 1.安装python,下载地址:ht ...

  5. sql 中常见的控制流语句

    控制流语句:1 begin .....end  2 if ...else  例如:if exists (select * from 表名称 ) begin selct * from  表名称 end  ...

  6. 堆排序 java实现

    import java.util.Arrays; /* * 思路: * 1.方法adjustDown:对于一个数组a[],针对第i个数进行向下(直到len-1)调整,使得该位置成为大顶堆 * 2.方法 ...

  7. 部署NTP服务器进行时间同步

    NTP服务端:linl_S    IP:10.0.0.15 NTP客户端:lin_C    IP:10.0.0.16 NTP服务概述 1.原理 NTP(Network TimeProtocol,网络时 ...

  8. Eclipse Jee环境配置

    最近下载了新的Eclipse Jee Neon版本,记录一下如何进行开发环境的配置. 1.下载必要的开发环境文件 ①下载Java SE Development Kit (简称JDK) ②下载Tomca ...

  9. 常用命令-python篇

    1. pip 加速命令 pip install --index-url https://pypi.douban.com/simple pip install -i https://pypi.tuna. ...

  10. tcpdump使用方法总结

    举例: 1.针对指定网卡eth0抓包 tcpdump -i eth0 2.过滤主机 tcpdump -i eth0 host 192.168.1.1 tcpdump -i eth0 src host ...