一、注册全局指令

1.注册一个全局指令

Vue.directive('title', {
inserted: function (el, binding) {
document.title = el.innerText
el.remove()
}
})

2.在需要更改页面标题的组件内调用我们刚注册的指令

<div v-title>标题内容</div>

二、直接使用document.title

      

参考:https://segmentfault.com/a/1190000007387556

vue2.0 网页标题更新实现思路的更多相关文章

  1. 实现vue2.0响应式的基本思路

    最近看了vue2.0源码关于响应式的实现,以下博文将通过简单的代码还原vue2.0关于响应式的实现思路. 注意,这里只是实现思路的还原,对于里面各种细节的实现,比如说数组里面数据的操作的监听,以及对象 ...

  2. vue2.0 — 移动端的输入框实时检索更新列表

    我们都是行走在这世界的孤独者 - 暖暖 最近在做vue2.0的项目遇到一个移动端实事检索搜索更新列表的效果,但用户在搜索框输入客户的电话或姓名的时候,客户列表内容会做相应的更新,下面给大家看下图~· ...

  3. vue2.0填坑有感(持续更新ing)

    1.请求数据 用本地json数据进行mock的时候,一般放在created 过程就Ok了,这样可以尽早获取数据:如果有依赖dom必须存在的清空,就放到mounted里面,具体用法如下所示: // cr ...

  4. Vue2.0 全家桶开发的网页应用(参照吾记APP)

    github链接 借鉴吾记APP,使用 vue2.0+vue-router+vuex 为主要技术栈,elementui做为ui框架,多模块 spa 模式,webpack2.0 负责模块打包,gulp ...

  5. 重开Vue2.0

    目录: 内容: 一.Vue内部指令: 1.v-if v-else&v-show v-if与v-show都是选择性显示内容的指令,但是二者之间有区别: 1.v-if:判断是否加载,在需要的时候加 ...

  6. 干货分享:vue2.0做移动端开发用到的相关插件和经验总结(2)

    最近一直在做移动端微信公众号项目的开发,也是我首次用vue来开发移动端项目,前期积累的移动端开发经验较少.经过这个项目的锻炼,加深了对vue相关知识点的理解和运用,同时,在项目中所涉及到的微信api( ...

  7. vue2.0做移动端开发用到的相关插件和经验总结

    最近一直在做移动端微信公众号项目的开发,也是我首次用vue来开发移动端项目,前期积累的移动端开发经验较少.经过这个项目的锻炼,加深了对vue相关知识点的理解和运用,同时,在项目中所涉及到的微信api( ...

  8. 项目vue2.0仿外卖APP(六)

    goods 商品列表页开发 布局编写 除了商品之外还有购物车,还有个详情页,挺复杂的. 两栏布局:左侧固定宽度,右侧自适应,还是用flex. 因为内容可能会超过手机高度,超过就隐藏.左右两侧的内容是可 ...

  9. Vue2.0环境搭建和测试demo

    Vue2.0 推荐开发环境 Homebrew 1.0.6(Mac).Node.js 6.7.0.npm 3.10.3.webpack 1.13.2.vue-cli 2.4.0.Atom 1.10.2 ...

随机推荐

  1. python中的collections.namedtuple

    简介 collections.namedtuple是一个工厂方法,它可以动态的创建一个继承tuple的子类.跟tuple相比,返回的子类可以使用名称来访问元素. 使用方法 用一个例子来介绍: > ...

  2. MSF初体验 - kali linux 入侵XP系统

    最近做某安全竞赛平台的比赛,真正开始接触Metasploit这一渗透神器,同时也是装逼神器(2333-.),下面记录一下初步使用Metasploit的过程.首先在百度百科摘录了一段关于Metasplo ...

  3. multisim&proteus&protel比较

    Multisim有超强板级的模拟/数字电路板的设计工作.它包含了电路原理图的图形输入.电路硬件描述语言输入方式,具有丰富的仿真分析能力.高版本可 以进行单片机等MCU的仿真.Multisim有实际元器 ...

  4. lnmp架构(第一篇)

    lnmp 架构 第一篇 nginx 源码安装 nginx的安装包:nginx-1.12.0.tar.gz 建议安装前的修改: 在nginx的解压包中修改文件nginx-1.12.0/src/core/ ...

  5. 微信H5支付:网络环境未能通过安全验证,请稍后再试。解决办法(PHP版)

    前(tu)言(cao) (这段前言纯属吐槽,着急解决问题的小伙伴,赶紧看正文吧) 最近做了支付宝和微信支付,先做的是PC端网站的支付,就是出个二维码,然后手机扫描支付,当然支付宝在扫码页面支持登录支付 ...

  6. java语言基础(变量和运算符)

    java八大基本数据类型: 整型{   int(整型)    short(短整型)   long(长整型)} 浮点型{ float(浮点型)   double(双精度)} 布尔{boolean}   ...

  7. Linux io Model

    socket阻塞与非阻塞,同步与异步 作者:huangguisu 1. 概念理解 在进行网络编程时,我们常常见到同步(Sync)/异步(Async),阻塞(Block)/非阻塞(Unblock)四种调 ...

  8. Kafka中操作topic时 Error:Failed to parse the broker info from zookeeper

      Kafka中操作topic时 Error: Failed to parse the broker info from zookeeper 1.问题描述   2.问题原因     kafka在启动后 ...

  9. Java jdk 快速配置

    JAVA_HOME C:\Program Files\Java\jdk1.8.0_92   Path %JAVA_HOME%\bin;%JAVA_HOME%\jre\bin;   CLASSPATH ...

  10. SVG裁切和蒙版

    前面的话 本文将详细介绍SVG裁切和蒙版 裁剪 SVG中的<clipPath>的元素,专门用来定义剪裁路径.必须设置的属性是id属性,被引用时使用 下面是一个圆形 <svg heig ...