vue手写tab分页，项目

手写分页效果如图：

 代码如下：

          <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)
            }
          },
}