Vant-Ui使用本地图片

转载于 2021-05-18 22:31:22 发布 · 734 阅读

CC 4.0 BY-SA版权

原文链接：https://blog.youkuaiyun.com/weixin_44068394/article/details/104924244

举个栗子

我们拿vantui的宫格来说

           <van-grid :border="false" :column-num="3" :gutter="10" square>
              <van-grid-item v-for="(value,index) in tabs" :key="index" :to="value.path" class="mb-1 mt-1 box_r">
                <!-- <van-image :src="value.img" class="mb-1" /> -->
                <img :src="value.img" alt="" style="width:100%;height:100%;">
                {{value.name}}
              </van-grid-item>
            </van-grid>

只需要数组套require(''图片地址)就可以

  data() {
    return {
      tabs: [
        {
          name: '待办列表',
          img: [require('../../assets/img/gg.jpg')],
          path: '/home/kcpg'
        }
      ]
    };
  },