vant-ui van-tabs 插入图片

vant-ui 中的Tab标签页 标题插入图片:

方式1: 插入图片,通过 title 插槽可以自定义标签内容
 

<van-tabs v-model="active">
        <van-tab>
          <div slot="title">
            <img  src="../../assets/images/home/douyinSmail.png">普通任务
          </div>
          内容1
        </van-tab>
        <van-tab>
          <div slot="title">
            <img  src="../../assets/images/home/douyinSmail.png">白银任务
          </div>
          内容 2
        </van-tab>
        <van-tab title="黄金任务">
          <div slot="title">
            <img  src="../../assets/images/home/douyinSmail.png">黄金任务
          </div>
          内容 3
        </van-tab>
        <van-tab>
          <div slot="title">
            <img  src="../../assets/images/home/douyinSmail.png">钻石任务
          </div>
          内容 4
        </van-tab>
 </van-tabs>

方式2:插入字体图标
 

<van-tabs v-model="active">
  <van-tab v-for="index in 2">
    <div slot="title">
      <van-icon name="more-o" />选项
    </div>
    内容 {{ index }}
  </van-tab>
</van-tabs>