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版本,最新版本 ...
随机推荐
- HDU4035 Maze (概率DP)
转:https://www.cnblogs.com/kuangbin/archive/2012/10/03/2711108.html 题意: 有n个房间,由n-1条隧道连通起来,实际上就形成了一棵树, ...
- CDN:BootCDN 项目列表-摘录-20180405
ylbtech-CDN:BootCDN 项目列表-20180405 1.返回顶部 1. 2. 2.返回顶部 3.返回顶部 4.返回顶部 5.返回顶部 1. http://www.boo ...
- Nginx证书配置:tomcat证书jks文件转nginx证书.cet和key文件
Nginx证书配置:tomcat证书jks文件转nginx证书.cet和key文件1.查看jks文件中的entry. keytool -list -keystore server.jks Enter ...
- Mac008--快捷键
Mac008--快捷键 来自于百度经验:https://jingyan.baidu.com/article/08b6a591aac09614a909224f.html 快捷键图示 基本的快捷键 Com ...
- 进程之间的通讯Queue简单应用
#进程间通讯--Queue #Process有时需要通信的,操作系统提供了很多机制来实现进程之间的通讯 #而Queue就是其中一个 #1.Queue的使用 #可以使用multiprocessing模块 ...
- PowerShell - Invoke VBA function
$xl = new-object -comobject Excel.Application $source_wb = $xl.workbooks.open($source) $xl.visible=$ ...
- (1)leetcode刷题Python笔记——两数之和
题目如下: 给定一个整数数组 nums 和一个目标值 target,请你在该数组中找出和为目标值的那 两个 整数,并返回他们的数组下标. 你可以假设每种输入只会对应一个答案.但是,你不能重复利用这个数 ...
- [Interview] Bubble sort using singly-linked list
Question : Bubble sort using singly-linked list 群暉面試題 Idea : 在linked list 交換node與node時, 我們會想用換*next ...
- Linux磁盘分区实例演示
一直觉得Linux的分区操作很高大上,之前在物理机上装的Linux,所以不敢随便乱来,今天重回Windows,下面利用Windows上的Linux虚拟机实际操作一次磁盘分区,要求:1G的硬盘分成2个2 ...
- StackExchange.Redis 使用LuaScript脚本模糊查询hash
原文:StackExchange.Redis 使用LuaScript脚本模糊查询hash 获取redis连接 public class RedisHelper { private static rea ...