router > index.js

        {
path: '/worklist',
name: 'worklist',
component: worklist,
meta: {title:'维修工列表',keyword:'success-list',description:'维修工列表'},
},

main.js

router.beforeEach((to, from, next) => {
/* 路由发生变化修改页面title */
if (to.meta.title) {
document.title = to.meta.title
}
next()
})
router.beforeEach((to, from, next) => {
/* 路由发生变化修改页面title */
if (to.meta.title) {
document.title = to.meta.title
}
next()
})

VUE-CLI 设置页面title的更多相关文章

  1. vue动态设置页面title方法

    第一种方法 npm install vue-wechat-title --save 在mian.js中引入 //设置title import VueWechatTitle from 'vue-wech ...

  2. 单页应用动态设置页面title

    1.适用场景:所有通过router路由的单页应用. 2.示例代码:本文以vue-router为例. 在router.js中: let router = new Router({ routes: [ { ...

  3. VUE修改每个页面title

    //index.js routes: [ { name:'home', path: '/home/:openname', component: Home, meta: { title: '首页' } ...

  4. 8.0 vue cli自定义页面

    1.新建a.html(public文件夹下)文件,并设定div的id="a" <!DOCTYPE html> <html lang=""> ...

  5. 用vue实现登录页面

    vue和mui一起完成登录页面(在hbuilder编辑器) <!DOCTYPE html> <html> <head> <meta charset=" ...

  6. 基于Vue的SPA动态修改页面title的方法

    最近基于VUE做个SPA手机端web发现动态修改页面标题通过document.title=xxxx 来修改着实蛋疼,而且在IOS的微信端据说没效果.百度发现要针对IOS的微信做点额外的操作,即:创建一 ...

  7. 046——VUE中组件之使用动态组件灵活设置页面布局

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. VUE cli 4.x下配置多页面以及同时配置支持element-ui及mint-ui并且优化首页文件大小。

    场景,公司的一个小型项目,需同时支持移动端和PC端.最开始考虑做两个独立的项目.但后来考虑到总共只有4个功能页面,布署起来相对麻烦.所以决定做在一个项目里. 1.升级vue-cli到4.x npm i ...

  9. 从0开始,手把手教你用Vue开发一个答题App01之项目创建及答题设置页面开发

    项目演示 项目演示 项目源码 项目源码 教程说明 本教程适合对Vue基础知识有一点了解,但不懂得综合运用,还未曾使用Vue从头开发过一个小型App的读者.本教程不对所有的Vue知识点进行讲解,而是手把 ...

随机推荐

  1. Web大文件上传控件-示例更新-Xproer.HttpUploader6.2

    版权所有 2009-2016荆门泽优软件有限公司 保留所有权利 官方网站:http://www.ncmem.com/ 产品首页:http://www.ncmem.com/webapp/up6.2/in ...

  2. SqueezeNet:AlexNet-level Accuracy with 50x fewer parameters and less than 0.5Mb model size

    - Fire modules consisting of a 'squeeze' layer with 1*1 filters feeding an 'expand' layer with 1*1 a ...

  3. 综合学生信息管理系统(JSP+JDBC)

    原创 通过JSP+JDBC制作一个简单的操作数据库中表信息的系统. 总体界面如下,一共有5个功能块. 功能一:列出全部学生 功能二:按条件查询学生 功能三:新添加学生 功能四:按条件删除学生 功能五: ...

  4. 一个数组:1,1,2,3,5,8,13,21...+m,求第30位数是多少?用递归实现;(常考!!!)

    using System; using System.Collections.Generic; using System.Linq; using System.Text; namespace Cons ...

  5. 去掉html标签方法

    public static string CleanHtml(string strHtml) { strHtml = Regex.Replace(strHtml, @"(\<scrip ...

  6. LOJ#10106. 「一本通 3.7 例 2」单词游戏

    题目链接:https://loj.ac/problem/10106 题目描述 来自 ICPC CERC 1999/2000,有改动. 有 NNN 个盘子,每个盘子上写着一个仅由小写字母组成的英文单词. ...

  7. Codeforces Round #545 (Div. 2)C(离散化,思维,PAIR排序)

    #include<bits/stdc++.h>using namespace std;int a[1007][1007];pair<int,int>p1[1007],p2[10 ...

  8. c++多线程基础3(mutex)

    整理自:zh.cppreference.com/w/cpp/thread 互斥锁 互斥算法避免多个线程同时访问共享资源.这会避免数据竞争,并提供线程间的同步支持.定义于头文件 <mutex> ...

  9. leecode刷题(2)-- 买卖股票的最佳时机

    买卖股票的最佳时机 给定一个数组,它的第 i 个元素是一支给定股票第 i 天的价格. 设计一个算法来计算你所能获取的最大利润.你可以尽可能地完成更多的交易(多次买卖一支股票). 注意:你不能同时参与多 ...

  10. 题解 P2960 【[USACO09OCT]Milkweed的入侵Invasion of the Milkweed】

    题目链接 首先这道题是一道经典的BFS.非常适合刚刚学习深搜的同学. 现在分析一下这个问题.首先,每周是八个方向.就是一圈. 也就是说入侵的范围关于时间是成辐射型扩散.让求最大时间. 也就是完美的BF ...