在vue中制作tab标签或导航下划线跟随效果

这篇主要记录在vue制作tab标签或者导航栏的下划线跟随效果

template中的html结构

要单独写一个标签做下划线，我用的是名为line的标签来做的
给它动态绑定left值

<ul class="tabs">
  <i class="line" :style="{left: slideLeft}"></i>
  <li v-for="(item, index) in tabList" :key="index" class="tab" :class="{
    &