vue移动端手写tab栏切换

复制代码结构----供自己直接使用：

    

      全部   
       **//注意a标签中的href必须去掉，否则路由出现问题**
    
    

      审核中
    
    

      审核通过
    
    

      退回
    
  
  
 

   

   
    

    //可直接编写内容
   
    

   
    

   
  

  在export default{
  data(){
  		return{
  		// 设置cur 默认值
  		cur：0
		}
  	}
  }

设置样式—可直接使用

/* tab栏切换 */
.tabsbox {
overflow: hidden;
border: 1px solid #fff;
}
.tabsbox li {
float: left;
font-size: 0.75rem;
width: 25%;
height: 1rem;
padding: 0.45rem 0;
background: #fff;
text-align: center;
border-bottom: 1px solid #e5e5e5;
}
.tabsbox li a {
padding: 0.35rem 0.5rem;
line-height: 1rem;
border-bottom: 1.5px solid transparent;
}
.tabsbox li a.active {
color: #7ed321;
border-bottom: 3px solid #7ed321;
}