vant Tabbar 标签栏 使用自定义图标

<van-tabbar active-color="#15975b" inactive-color="#000" v-model="active">
      <van-tabbar-item name="/home" to="/">
        <span>主页</span>
        <img slot="icon" slot-scope="props" :src="props.active ? icon.a_home: icon.nor_home" />
      </van-tabbar-item>
      <van-tabbar-item name="/datas" to="/datas">
        <span>数据</span>
        <img slot="icon" slot-scope="props" :src="props.active ? icon.a_mydatas : icon.nor_mydatas" />
      </van-tabbar-item>
      <van-tabbar-item name="/static" to="/static">
        <span>统计</span>
        <img slot="icon" slot-scope="props" :src="props.active ? icon.a_statis : icon.nor_statis" />
      </van-tabbar-item>
      <van-tabbar-item name="/user" to="/user">
        <span>我的 </span>
        <img slot="icon" slot-scope="props" :src="props.active ? icon.a_user : icon.nor_user" />
      </van-tabbar-item>
    </van-tabbar>
    
    active: "/home",
    //引入自己本地的图片 icon: { a_home: require(
"@/assets/imgs/ahome.png"), nor_home: require("@/assets/imgs/nhome.png"), a_mydatas: require("@/assets/imgs/adata.png"), nor_mydatas: require("@/assets/imgs/ndatas.png"), a_statis: require("@/assets/imgs/astatic.png"), nor_statis: require("@/assets/imgs/nstatic.png"), a_user: require("@/assets/imgs/auser.png"), nor_user: require("@/assets/imgs/nuser.png"), },
原文地址:https://www.cnblogs.com/lxsunny/p/14575465.html