编程 Javascript

Vue2.0 给Tab标签页和页面切换过渡添加样式的方法

Posted in Javascript onMarch 13, 2018

使用vue-router构建单页应用时，如何给当前页面的标签页添加样式呢？

1.在app.vue文件中你的nav中添加路由地址

2.依然在app.vue文件中，添加样式

Vue2.0 给Tab标签页和页面切换过渡添加样式的方法

不用在任何位置加class，只要在css中写上这个名称，样式自己随意改。

如何在单页切换的时候添加过渡？

1.在app.vue文件中，将router-view包裹在transition中，transition加个name。

Vue2.0 给Tab标签页和页面切换过渡添加样式的方法

2.在app.vue中添加css样式（你的transition的name是什么，第一个单词就是什么）

Vue2.0 给Tab标签页和页面切换过渡添加样式的方法

以上这篇Vue2.0 给Tab标签页和页面切换过渡添加样式的方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持三水点靠木。

Vue2.0 给Tab标签页和页面切换过渡添加样式的方法

- Author -

yhyclelo

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

对象的类型：本地对象(1)

Dec 29 Javascript

网站基于flash实现的Banner图切换效果代码

Oct 14 Javascript

让IE8浏览器支持function.bind()方法

Oct 16 Javascript

javascript批量修改文件编码格式的方法

Jan 27 Javascript

解析Node.js基于模块和包的代码部署方式

Feb 16 Javascript

jQuery Easyui datagrid editor为combobox时指定数据源实例

Dec 19 Javascript

总结几道关于Node.js的面试问题

Jan 11 Javascript

d3.js中冷门却实用的内置函数总结

Feb 04 Javascript

vue.js删除动态绑定的radio的指定项

Jun 02 Javascript

AngularJS中filter的使用实例详解

Aug 25 Javascript

JS前端知识点总结之内置对象，日期对象和定时器相关操作

Jul 05 Javascript

Vue中axios的封装（报错、鉴权、跳转、拦截、提示）

Aug 20 Javascript

vue2.0 实现页面导航提示引导的方法

Mar 13 #Javascript

vue2.0 根据状态值进行样式的改变展示方法

Mar 13 #Javascript

使用Vuex实现一个笔记应用的方法

Mar 13 #Javascript

基于Axios 常用的请求方法别名(详解)

Mar 13 #Javascript

Bootstrap 中data-[*] 属性的整理

Mar 13 #Javascript

JS实现的集合去重，交集，并集，差集功能示例

Mar 13 #Javascript

setTimeout时间设置为0详细解析

Mar 13 #Javascript