动态修改vue-cli的spa的标题
2018-03-19 19:16
645 查看
import Vue from 'vue' import Router from 'vue-router' import Home from '@/components/home' import Items from '@/components/Items' import Waterfull from '@/components/Waterfull' Vue.use(Router) const router = new Router({ mode: 'history', routes: [ { path: '/', name: 'home', alias: '/home', meta: { title: '首页' }, component: Home }, { path: '/items', name: 'Items', meta: { title: 'web项目' }, component: Items }, { path: '/items/Waterfull', name: 'Waterfull', meta: { title: '瀑布流' }, component: Waterfull } ] }) router.beforeEach(function(to,from,next){ if(to.meta.title){ document.title = to.meta.title }else{ document.title = 'personal learn' } next() }) export default router
主要通过
router.beforeEach(function(to,from,next){ if(to.meta.title){ document.title = to.meta.title }else{ document.title = 'personal learn' } next() })
进行修改;
相关文章推荐
- 基于Vue的SPA动态修改页面title的方法
- 对于Vue-cli的路由跳转以及使用vue.js动态修改CSS样式
- tabHost动态改标题文字,动态修改图片
- 动态修改Ribbon风格窗口标题的做法
- asp.net2.0中动态修改页面标题
- 通过vue-cli来学习修改Webpack多环境配置和发布问题
- easyui 动态修改标题行,tr和td样式
- 动态修改Ribbon风格窗口标题的做法
- 动态修改窗口标题和类名
- MFC 动态修改对话框的标题
- ASP.NET2.0动态修改网页关键字、标题等
- ReportStudio入门教程(六十六) - 文本源变量(动态修改列标题)
- vue-cli项目修改文件热重载失效
- vue-cli项目修改文件热重载失效的解决方法
- asp.net 2.0中动态修改页面标题
- vue-cli 打包压缩(npm run build)文件后,默认根目录修改
- Android TabHost 动态修改图标或者动态改变标题
- asp.net 2.0中动态修改页面标题
- vue-cli+webpack项目 修改项目名称
- MFC对话框型程序动态修改自身标题