zoukankan      html  css  js  c++  java
  • mui底部导航栏

    mui是通过mui-active的class属性来表示激活状态(改变该按钮的颜色)

     <router-link class="mui-tab-item  mui-active" :to="{name:'member'}">
           <span class="mui-icon icon-myhuiyuan"></span>
           <span class="mui-tab-label">会员</span>
    </router-link>

    配合router-link的linkActiveClass属性,就能在每次点击后并且跳转后,改变样式。

    let router = new VueRouter({
        linkActiveClass:'mui-active',   //router-link成功后,就给该按钮加上mui-active属性。
        routes: [
            //VueRouter:配置路由规则
            { path: '/', redirect: { name: 'home' } }, //重定向
            { name: 'home', path: '/home', component: Home },//首页
            { name:'member',path:'/member',component: Member}, //会员
            { name: 'shopcart',path:'/shopcart',component:Shopcart}, //购物车
            { name: 'search',path:'/search',component:Search}, //查找
            { name:'news.list',path:'/news/list',component:NewsList}, //新闻列表
            { name:'news.detail',path:'/news/detail',component:NewsDetail}, //新闻详情
        ]
    });
  • 相关阅读:
    所有程序员都是自学成才
    Xcode6模拟器路径
    Xcode7中模拟器的位置
    数据结构中的二级指针和引用
    02_线性表的链式表示和实现
    Spring 单例 httprequest 线程安全
    Springboot listener
    Spring单例 和 Scope注解
    红黑树
    线程池
  • 原文地址:https://www.cnblogs.com/sujianfeng/p/8879631.html
Copyright © 2011-2022 走看看