vue开发 - 根据vue-router的meta动态设置html里标签的内容
路由文件 :router/index.js
import Vue from 'vue'
import Router from 'vue-router'
import index '@/view/index'
import user from '@/view/user'
Vue.use(Router)
export default new Router({
routes: [
{
path: '/index',
name: 'index',
component: index,
meta:{
title:'首页'
}
},
{
path: '/user',
name: 'user',
component: user,
meta:{
title:'个人中心'
}
}
]
})
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
在入口文件 main.js中添加以下代码
import Vue from 'vue'
import App from './App'
import router from './router'
router.beforeEach((to, from, next) => {
if (to.meta.title) {
document.title = to.meta.title
}
next()
})
new Vue({
el: '#app',
router,
template: '<App/>',
components: {App}
})
---------------------
作者:、不知不觉、
来源:CSDN
原文:https://blog.csdn.net/u010394015/article/details/79132591
版权声明:本文为博主原创文章,转载请附上博文链接!
vue开发 - 根据vue-router的meta动态设置html里标签的内容的更多相关文章
- vue开发 - 根据vue-router的meta动态设置html里title标签内容
1.路由文件 :router/index.js 添加 meta属性配置: import Vue from 'vue' import Router from 'vue-router' import in ...
- 【vue开发】vue导出Excel表格教程&demo
前端工作量最多的就是需求,需求就是一直在变,比如当前端数据写完之后,需要用Excel把数据下载出来:再比如前端在没有数据库想写些demo玩时,也是很好的选择. 第一步安装依赖包,修改配置 1.装依赖: ...
- 每天一点点之vue框架开发 - 数据渲染-for循环中动态设置页面背景色
实现方式很简单,在属性前加:,表示绑定 :style="{'background':item.bgColor} 代码样例: <li v-for="item in laber_ ...
- [vue开发记录]vue仿ios原生datepicker实现
先上个效果图 现在只开发了年月,还在优化. 在网上看了一个纯原生js实现实现惯性滚动和回弹的文章 地址:https://www.cnblogs.com/ranyonsue/p/8119155.htm ...
- 【前端vue开发】vue单页应用添加百度统计
前言 申请百度统计后,会得到一段JS代码,需要插入到每个网页中去,在Vue.js项目首先想到的可能就是,把统计代码插入到index.html入口文件中,这样就全局插入,每个页面就都有了;这样做就涉及到 ...
- 【前端vue开发】vue开发输入姓名,电话,公司表单提交组件
<template> <div id="parti-info"> <div> <span>您的姓名:</span> &l ...
- 【前端vue开发】vue知识点超链接学习笔记
1.如何去除vue项目中的 # --- History模式: https://www.cnblogs.com/zhuzhenwei918/p/6892066.html 2.三分钟教你写个Vue组件: ...
- 【前端vue开发】vue子调父 $emit (把子组件的数据传给父组件)
ps:App.vue 父组件 Hello.vue 子组件 <!--App.vue :--> <template> <div id="app"> ...
- 【前端vue开发】vue开发watch检测的使用
<span style="color:#006600;"><div id="app"> <input type="tex ...
随机推荐
- ChartCtrl源码剖析之——CChartTitle类
CChartTitle类顾名思义,该类用来绘制波形控件的标题,它处于该控件的区域,如下图所示: CChartTitle类的头文件. #if !defined(AFX_CHARTTITLE_H__499 ...
- 关于kafka-clients JAVA API的基本使用
首先老规矩, 引入maven依赖 <dependency> <groupId>org.apache.kafka</groupId> <artifactId&g ...
- mysql 里面的isnull()和ifnull() is null 和 is not null
usergrade表 1.找到里面username是null的行 SELECT * FROM usergrade WHERE ISNULL(USERNAME) SELECT * FROM usergr ...
- 微信支付接口调用问题(android正常,iphone调不起)
转自:http://blog.csdn.net/tt123123/article/details/53897035 碰到的问题 :根据微信提供的示例代码(ASP.NET),配置好一切后, 用andro ...
- 面试基础试题 一 http和HTTPS的区别
作为老生常谈的问题,我主要给出我自己的理解和结合大牛的叙述的综合看法,来检验自己学习 超文本传输协议HTTP协议被用于在Web浏览器和网站服务器之间传递信息,HTTP协议以明文方式发送内容,不提供任何 ...
- Unix\Linux | 总结笔记 |文件系统_shell重定向
输入重定向< 从文件中获得命令需要的输入数据,适合数据源已经定义好,可重复使用 #显示文件test.txt的内容 cat < tesxt.txt #统计文件test.txt中的行数 单词数 ...
- [SRM613~] TaroCheckers
一定要注意Topcoder的提交机制 Links: 原题地址 Vjudge Solution 这道题思维比较巧妙. 一看就基本知道是一个Dp题. 首先转换一下,用列而不是行来设第一维的状态,因为每列只 ...
- bzoj2581 [USACO 2012 Jan Gold] Cow Run【And-Or Tree】
传送门1:http://www.usaco.org/index.php?page=viewproblem2&cpid=110 传送门2:http://www.lydsy.com/JudgeOn ...
- 题解报告:hdu 1176 免费馅饼(递推dp)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1176 Problem Description 都说天上不会掉馅饼,但有一天gameboy正走在回家的小 ...
- SpringCloud开发学习总结(四)—— 客户端负载均衡Ribbon
通过上一章<SpringCloud开发学习总结(三)—— 服务治理Eureka>,我们已经搭建起微服务架构中的核心组件——服务注册中心(包括单点模式和高可用模式).同时还注册了一个服务,命 ...