Vue-cli 项目设置每个页面标题
页面标题
在vue-router页面配置中添加meta的title信息,配合vue-router的beforeEach注册一个前置守卫用户获取到页面配置的title
const title = '移动端';
export default function getPageTitle (pageTitle) {
if (pageTitle) {
return `${pageTitle} - ${title}`
}
return `${title}`
}
router.beforeEach((to, from, next) => {
// set page title
document.title = getPageTitle(to.meta.title)
}
router
{
path: '/annunciate',
name: 'annunciate',
component: annunciate,
meta:{
title: '通告广场'
}
},
Vue-cli 项目设置每个页面标题的更多相关文章
- 改造@vue/cli项目为服务端渲染-ServerSideRender
VUE SEO方案二 - SSR服务端渲染 在上一章中,我们分享了预渲染的方案来解决SEO问题,个人还是很中意此方案的,既简单又能解决大部分问题.但是也有着一定的缺陷,所以我们继续来看下一个方案--服 ...
- vue.js 使用 vue-router 修改页面标题
module.exports = { name: 'myComponent', data: {} route{ data: function(){ document.title = "页面标 ...
- vue cli 构建的 webpack 项目设置多页面
1. webpack-dev-server下的设置(npm run dev) ./build/webpack.dev.conf.js 中,修改 new HtmlWebpackPlugin ,一个页面一 ...
- vue cli 项目中设置背景图
https://blog.csdn.net/MoLvSHan/article/details/78204972 不能直接写成相对路径,像下面这这种就会报错 backgroundImage: " ...
- vue本地项目设置通过手机访问
最近再用vue写一个移动端的应用,想通过手机访问看看页面效果,于是有了下文. 1.shif+右键打开命令行工具,输入ipconfig,回车,得到电脑的ip 2.找到工作目录下的config文件夹中的i ...
- vue cli 项目的提交
前提: 配置git.以及git的ssh key信息 假设已经都安装好了,此处我用vue项目为例,因为vue-cli已经默认为我生成了ignore文件 在项目目录 初始化本地仓库,会创建一个.git目录 ...
- vue cli 脚手架上多页面开发 支持webpack2.x
A yuri demo for webpack2 vue multiple page.我看到有一些项目多页面项目是基于webapck1.0的,我这个是在webpack2.x上布置修改. 项目地址: ...
- 用 vue cli 脚手架搭建单页面 Vue 应用(进阶2)
1.配置 Node 环境. 自行百度吧. 安装好了之后,打开 cmd .运行 node -v .显示版本号,就是安装成功了. 注:不要安装8.0.0以上的版本,和 vue-cli 不兼容. 我使用的 ...
- Vue cli项目开启Gzip
目录 安装 compression-webpack-plugin 更改配置文件 服务器开启gzip功能 安装 compression-webpack-plugin 建议安装v1.1.11版本,最新版本 ...
随机推荐
- 高级Javascript代码
Javascript是一门很吊的语言,我可能学了假的JavaScript,哈哈,大家还有什么推荐的,补充送那啥邀请码. 本文秉承着:你看不懂是你SB,我写的代码就要牛逼. 1.单行写一个评级组件 &q ...
- day20—CSS中伪类:before与:after的应用:
转行学开发,代码100天——2018-04-05 CSS中的两个伪类:before和:after适合应用与在元素的开始或者结尾处添加修饰性文字或外观,实现内容添加的同时并没有破坏HTML代码 语义.如 ...
- Git003--创建版本库
Git--创建版本库 本文来自于:https://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b000 ...
- EasyUI的datagrid列属性添加超链接
$("#dg").datagrid({ url: "../Ajax/PurchaseAjax.ashx", queryParams: ...
- 结合Pool进程池进程,实现进程之间的通讯,稍微复杂的运用
#进程池中的Queue """ 如果要用Pool创建进程,就需要multiprocessing.Manager()中的Queue() 而不是multiprocessing ...
- Invalid column name on sql server update after column create
问题:新建一个测试表xx as code into xx select * from xx 给这个表添加一个列val, val列不允许为空,将表中已有的数据val值更新为1 alter table x ...
- html5_websql
var db = openDatabase('mydb', '1.0', 'Test DB', 2 * 1024 * 1024); var msg; db.transaction(function ...
- [功能集锦] 003 - 一键生成mysql数据字典/数据库速查表
写在前面: 因为工作时候经常遇到半路接手项目的情况,由于年代久远,数据库字典这块经常缺失.故写此篇,以便复用,也希望对大家有点帮助. 随笔内容不高级,如有不妥,不吝指正. ps:有另一篇详细随笔可以参 ...
- android测试开发概念
一:测试分类 1.分类概览 按测试阶段划分: 单元测试 集成测试 系统测试 验收测试 按是否覆盖源代码: 黑盒测试: 功能测试: 界面测试 逻辑测试 安装测试 应用性测试 兼容性测试 性能测试: 稳定 ...
- [Bzoj1003][ZJOI2006]物流运输(spfa+dp)
题目链接:https://www.lydsy.com/JudgeOnline/problem.php?id=1003 比较简单的dp,dp[i]为1-i天最小费用,dp方程为dp[i] = min(d ...