美文网首页
vue中引入图片

vue中引入图片

作者: 李小白呀 | 来源:发表于2021-07-05 21:51 被阅读0次

    1.在img标签里面直接写上路径:(静态)

    <img src="../assets/a1.png" class="" width="100%"/>
    

    2.利用数组保存再循环输出:(动态)

    <el-carousel-item v-for="item in carouselData" :key="item.id">
            <img :src="item.url" class="carouselImg"/>
            <span class="carouselSpan">{{ item.title }}</span>
    </el-carousel-item>
    data: () => ({
          carouselData:[
          {url:require('../assets/a1.png'),title:'图片1',id:1},
          {url:require('../assets/a3.png'),title:'图片2',id:2},
          {url:require('../assets/a4.png'),title:'图片3',id:3}
          ]
        }),
    

    相关文章

      网友评论

          本文标题:vue中引入图片

          本文链接:https://www.haomeiwen.com/subject/qjziultx.html