方法1. 在需要的组件或者页面内设置 document.title = response.data.res.title

方法2.

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title>基础入门</title>

    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

    <script src="../vue2.1.3.js" type="text/javascript" charset="utf-8"></script>

    <style type="text/css">

        div {

            margin: 10px 0;

        }

    </style>

</head>

<body>

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

</body>

<script type="text/javascript">

    Vue.directive('title', {

        inserted: function(el, binding) {

            document.title = el.innerText

            el.remove()

        }

    })

</script>

方法3.  router 里用导航修改

// 导航守卫
router.beforeEach((to, from, next) => {
  console.log('to', to)
  console.log('topath', to.path)
  console.log('to.meta.title', to.meta.title)
  if(to.path == "/auth") {
    document.title = to.meta.title || '渠道授权' // 当前想修改页面的标题
  } else document.title = 'CPS流量变现后台管理系统'  // 默认标题
  next()
});

vue 修改单页标题 --- document.title的更多相关文章

  1. 做一个gulp+webpack+vue的单页应用开发架子

    1.目标 最近项目上的事情不多,根据我自己的开发习惯,决定开发一些简单的开发架子,方便以后事情多的时候直接套用.本文讲的一个gulp+webpack+vue的单页应用架子,想要达到的目的: 可以通过命 ...

  2. [vue]spa单页开发及vue-router基础

    - 了解spa页面跳转方式:(2种) spa: 单页跳转方式 开发(hash模式): https://www.baidu.com/#2313213 生产(h5利于seo): history.pushS ...

  3. 如何动态修改网页的标题（title）？

    有时候我们需要复用一个页面,但是又希望他们拥有各自的标题,这时候就需要动态的去更改页面的title了,不然所有页面都是一个标题. 这时候就会想到使用js或jQuery去实现了. 1.js方式. 首先, ...

  4. 使用Vue构建单页应用一

    一. 环境准备 1 安装Node.js  最好安装node.js-6.X.X 以上版本,https://nodejs.org/en/    我使用的是  v6.3.1 Current 版本.Node. ...

  5. 一套Vue的单页模板：N3-admin

    趁着周末偷来一点闲,总结近期的工作和学习,想着该花点心思把N3-admin这套基于N3-components的单页应用模板简单的给介绍一下. 首发于个人博客:blog.lxstart.net项目路径: ...

  6. Vue 部署单页应用，刷新页面 404/502 报错

    在 Vue 项目中,可以选择 hash或者 history.pushState() 实现路由跳转.如果在路由中使用history模式: export default new Router({ mode ...

  7. vue实现单页应用demo

    vue + webpack +ES6/7 + axiso + vuex + vue-router构建项目前端,node + express + mongodb 开发后台 项目demo地址 https: ...

  8. vue项目单页

    <template> <div> <div v-if="type === 'A'">A</div> <div v-else-i ...

  9. vue单页应用前进刷新后退不刷新方案探讨

    引言 前端webapp应用为了追求类似于native模式的细致体验,总是在不断的在向native的体验靠拢:比如本文即将要说到的功能,native由于是多页应用,新页面可以启用一个的新的webview ...

随机推荐

  1. 面板Panel

    面板 主要步骤: 1.new一个frame窗口 格式 Frame frame = new Frame() 2.设置窗口的大小.位置.可见性 3.设置frame窗口的布局格式(分为流式布局,东西南北中, ...

  2. 运营商的三大数据域——B域，O域，M域

    O域(运营域).B域(业务域).M域(管理域)特指电信行业大数据领域的三大数据域. B域(业务域)= business support system的数据域, O域(运营域)= operation s ...

  3. RabbitMQ Go客户端教程3——发布/订阅

    本文翻译自RabbitMQ官网的Go语言客户端系列教程,本文首发于我的个人博客:liwenzhou.com,教程共分为六篇,本文是第三篇--发布/订阅. 这些教程涵盖了使用RabbitMQ创建消息传递 ...

  4. [环境部署] Windows Server 2016 配置指南 之 安装 Redis3.0

    Redis是一个开源的高级key-value(键-值)缓存与存储,以高性能著称.用于做对象缓存,可以获得极佳的性能体验,可是 Redis 的官方开发团队并没有开发针对 Windows 的版本,不过还好 ...

  5. 提升组件库通用能力 - NutUI 在线主题定制功能探索

    开发背景 NutUI 作为京东风格的组件库,已具备 H5 和多端小程序开发能力.随着业务的不断发展,组件库的应用场景越来越广.在公司内外面临诸如科技.金融.物流等各多个大型团队使用时,单一的京东 AP ...

  6. MySQL—索引（Index）

    前言: 关于MySql索引数据结构和实现原理的讲解值得阅读一下: 实现原理:https://www.cnblogs.com/songwenjie/p/9415016.htm 索引数据结构:https: ...

  7. Idea集成CSSO插件压缩css文件

    首先需要本地已安装node环境,并且csso-cli已通过npm安装到本地目录,只要能找到就行. 1. 打开Settings配置,确认图中的 File Watchers 插件是否已存在,如果不存在,去 ...

  8. Dubbo 支持服务降级吗？

    以通过 dubbo:reference 中设置 mock="return null".mock 的值也可以修改 为 true,然后再跟接口同一个路径下实现一个 Mock 类,命名规 ...

  9. spring-boot-关于配置文件

    ------------恢复内容开始------------ spring-boot 的配置文件有四个地方: 项目更目录下的config目you录下(自己建) 项目根目录下 resource 目录下的 ...

  10. yum下载安装mysql服务

    1.下载mysql源码 wget http://dev.mysql.com/get/mysql57-community-release-el7-8.noarch.rpm 2.安装mysql源 yum ...