1、项目中,cmd下 ,运行:cnpm install vue-wechat-title --save

2、在 main.js 中,设置:

import VueWechatTitle from 'vue-wechat-title';

Vue.use(VueWechatTitle)

3、在router / index.js 中,设置:

{
  path: '/Home',
  name: 'Home',
  component: Home,
  meta: {
    title: 'Home'  //此处为要修改的 title 名称,浏览器目前的标题显示:Home
  }
}

4、在app.vue中,添加组件:

<router-view v-wechat-title="$route.meta.title"></router-view>

此上,就可以自动修改浏览器标题了

vue动态修改title的更多相关文章

  1. Vue动态修改网页标题

    业务需求,进入页面的时候,网页有个默认标题,加载的网页内容不同时,标题需要变更. 例:功能授权,功能授权(张三). Vue下有很多的方式去修改网页标题,这里总结下解决此问题的几种方案: 一.最笨方案 ...

  2. Vue 动态修改data 值 并触发视图更新

    Vue 动态修改data 值 并触发视图更新 this.$set(obj, key, '') // Vue 动态修改或者添加data key 并触发视图更新

  3. vue-wechat-title动态修改title

    在使用Vue制作项目的过程中,发现title没有变化 所以使用vue-wechat-title插件动态修改tilte 一.安装 npm vue-wechat-title --save 二.引入和使用 ...

  4. 用document.title=“xxx”动态修改title,在ios的微信下面不生效

    单页应用里整个页面只会在第一次完全刷新,后面只会局部刷新(一般不包括head及里面的title),所以无法在服务器端控制title,只能在页面刷新的时候通过js修改title.常规做法如下,可惜在iO ...

  5. 微信小程序动态修改title,动态配置title,动态配置头部,微信小程序动态配置头部

    微信小程序的title是在json里面配置的 "navigationBarTitleText": "title名称" 这种title是固定死的不灵活处理一些页面 ...

  6. 在vue中如何动态修改title标签的值

    建议用vue-wechat-title插件为微信动态设置标题 1,首先安装插件 cnpm install vue-wechat-title --save 2,在main.js中引入 Vue.use(r ...

  7. vue单页面应用中动态修改title

    https://www.jianshu.com/p/b980725b62e8 https://www.npmjs.com/package/vue-wechat-title 详细信息查看:vue-wea ...

  8. vue router 修改title(IOS 下动态改变title失效)

    在ios下app  设置document.title = "titleName" 失效,原因是在IOS webview中网页标题只加载一次,动态改变是无效的. 在路由配置中添加   ...

  9. 用document.title=“xxx”动态修改title,在ios的微信下面不生效的解决办法!

    //需要jQuery var $body = $('body'); document.title = 'title'; // hack在微信等webview中无法修改document.title的情况 ...

随机推荐

  1. 探索ORM之iBati(一)

    ibatis   iBATIS一词来源于“internet”和“abatis”的组合,是一个由Clinton Begin在2001年发起的开放源代码项目.最初侧重于密码软件的开发,现在是一个基于Jav ...

  2. 使用 PowerShell 创建 Linux 虚拟机

    Azure PowerShell 模块用于从 PowerShell 命令行或脚本创建和管理 Azure 资源. 本指南详细介绍了如何使用 Azure PowerShell 模块部署运行 Ubuntu ...

  3. Elasticsearch入坑指南之RESTful API

    Elasticsearch入坑指南之RESTful API Tags:Elasticsearch ES为开发者提供了非常丰富的基于Http协议的Rest API,通过简单的Rest请求,就可以实现非常 ...

  4. Java 系统学习梳理_【All】

    Java基础 1. Java学习---JDK的安装和配置 2. Java学习---Java代码编写规范 2. Java学习---HashMap和HashSet的内部工作机制 3. Java学习---J ...

  5. 执行一条sql语句update多条记录实现思路

    如果你想更新多行数据,并且每行记录的各字段值都是各不一样,你会怎么办呢?本文以一个示例向大家讲解下如何实现如标题所示的情况,有此需求的朋友可以了解下 通常情况下,我们会使用以下SQL语句来更新字段值: ...

  6. Ubunt16.04下安装PHP7+Nginx+MySQL

    本文通过Ubuntu PPA来安装PHP7.   1.添加PPA $ sudo apt-get install python-software-properties software-properti ...

  7. python2.x和3.x的区别(不定时更新)

    python2.x和3.x的区别 文:铁乐与猫 2018.3.16新增博文,为方便以后总结Python2.x与3.x的不同版本之间的区别,随时更新. python原本的宗旨是崇尚优美.清晰.简单.但p ...

  8. 为什么php+apache本地站点访问超级慢

    /etc/hosts中必然有一行为127.0.0.1,作用是什么呢? 特点: (1)127.0.0.1不光是unix系统,linux也好,windows也好,都会有这个循回地址的.(2)在IP地址的规 ...

  9. Basestation函数解析(二)

    ---恢复内容开始--- 这部分从Basestation的RecvDataThread开始,流程为 RecvDataThread->RecvData->Decoder->PostDa ...

  10. 简单的dp加贪心

    题目链接:传送门 这个题目让我纠结了好久,之后恍然大悟是求最长的递减序列,并加上贪心的算法,如果有大于两个的发射系统,应该判断使导弹的高度与此时个个发射系统的高度比较,选取高度差最小的去执行这次的拦截 ...