手写分页效果如图:
代码如下:
<ul class="tabs_item">
<li
v-for="(index,item) in tabs"
:class="{tabs_items:true,active:index == num}"
@click="tab(index)"
>
{{ index }}
</li>
</ul>
data{
tabs: [
'整单采购',
'商品定制',
'施工服务',
'营销获客',
'生态服务',
],
num: '整单采购',
}
methods:{
tab(index, e) {
this.num1 = ''
this.num = index
//下面是一些其他操作,和tab分页无关,请忽视
if(this.num==='整单采购'){
localStorage.setItem("formstatus",0)
}
if(this.num==='商品定制'){
localStorage.setItem("formstatus",1)
}
if(this.num==='施工服务'){
localStorage.setItem("formstatus",2)
}
if(this.num==='方案设计'){
localStorage.setItem("formstatus",3)
}
if(this.num==='营销获客'){
localStorage.setItem("formstatus",0)
}
if(this.num==='生态服务'){
localStorage.setItem("formstatus",0)
}
},
}