因为和原生的交互是需要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. 使用JS语句,利用for循环的方法创建表格的两种方法

    首先去layui官网下载教程示例,在项目中加载layui.css,layui.js,JQuery.js 第一种: 将jsp语句写成字符串的形式,使用document.write()方式输出: 代码如下 ...

  2. 使用fiddler轻轻松松制造客户端接口time out的情况

    1.打开fiddler,过滤出你想要的请求 2.复制出你想要中断的请求 3.设置中断这个请求,bpu+请求,回车(详情请百度fiddle默认命令) 4.ctrl+x(清楚所有的请求),刷新页面,重新获 ...

  3. idea使用教程(2)

    目录: 1. open和import的区别 2.修改虚拟机配置信息 3.安装目录和设置目录 1. open和import的区别 open:如果本身就是idea项目,则可以直接open打开; impor ...

  4. Java中有多个异常, 如何确定捕获顺序(多个catch),先从上到下执行,判断异常的大小,如果包含捕到异常,就进入这个catch,后面的就不再执行

    Java中异常的捕获顺序(多个catch)( Java代码 import java.io.IOException; public class ExceptionTryCatchTest { publi ...

  5. 《剑指offer》第四十六题(把数字翻译成字符串)

    // 面试题46:把数字翻译成字符串 // 题目:给定一个数字,我们按照如下规则把它翻译为字符串:0翻译成"a",1翻 // 译成"b",……,11翻译成&qu ...

  6. iview使用的bug

    1.table中排序和render方法不能共存,解决方法:保留render,然后排序不用提供的排序,自己写事件.

  7. 第 8 章 容器网络 - 056 - macvlan 网络结构分析

    macvlan 网络结构分析 macvlan 不依赖 Linux bridge,brctl show 可以确认没有创建新的 bridge. 查看一下容器 bbox1 的网络设备: 除了 lo,容器只有 ...

  8. 通过cookies跳过验证码登陆页面,直接访问网站的其它URL

    我每次手动访问去NN网的一家酒店,就不需要登陆,一旦我用脚本打开就会让我登陆,而登陆页面又有验证码,不想识别验证码,所以就想:“通过cookies跳过验证码登陆页面,直接访问网站的其它URL”   转 ...

  9. Ubuntu终端多窗口分屏Terminator

    1.安装 Terminator最大的特点就是可以在一个窗口中打开多个终端 sudo apt-get install terminator 2.快捷键 Ctrl+Shift+E    垂直分割窗口 Ct ...

  10. Windows Live Wirter

    安装: 下载: Windows Live Writer (QQ 里) windows live writer 日志服务器发生问题 更新账户信息 从字面"editPost"我们不难看 ...