vue底部导航切换（原生切换图片）功能实现

需求：底部导航切换页面，同时切换图片。底部为公共组件

组件代码：

<div class="weui-tabbar">

        <a href="javascript:;" class="weui-tabbar__item " v-for="(i,index) in tabs" :key="index" :class="{active:index == thatnum}" @click="addClassName(index)">
          <router-link :to="i.url">
            <img v-if="thatnum!=index"  :src="i.img" class="first weui-tabbar__icon">
            <img v-if="thatnum==index"  :src="i.active" class="last first weui-tabbar__icon">
            <p class="weui-tabbar__label">{
  {i.text}}</p>
          </router-link>
        </a>