(vant)使用vant轮播图无法使用本地图片

最新推荐文章于 2024-04-07 15:34:13 发布

置顶 vvvvv_2

最新推荐文章于 2024-04-07 15:34:13 发布

阅读量2.3k

点赞数 3

本文链接：https://blog.csdn.net/qq_36663526/article/details/107594256

版权

框架及插件专栏收录该内容

9 篇文章 0 订阅

订阅专栏

使用vant框架的轮播图组件时，直接引用本地图片会无法显示。解决办法是在数据外加上require
eg：

<template>
  <div>
    <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
      <van-swipe-item v-for="item in img" :key="item">
        <van-image :src="item"/>
      </van-swipe-item>
    </van-swipe>
  </div>
</template>

<script>
export default {
  data() {
    return {
      img:[
        require("@/assets/images/5a2e2dba4a4c1bef4c4ee4e2f712449f.jpeg"),
        require("@/assets/images/3767a25c2a5654b3cfa98e7368189177.jpeg"),
        require("@/assets/images/0791d41f4404d380028b8f2c6d594967.jpeg"),
      ]
    }
  }
}
</script>

<style>

</style>