单页面如何使用vant的ImagePreview图片预览

1.单页面时使用   

   <img  v-for="(item,index) in imgArr" :key="index" :src="item" alt="" height="58px" width="58px" style="margin-right: 16px;" onerror="this.src='../assets/images/default_device.png'" @click="imgLook(index)">

  

<script src="../lib/vant/vant.min.js"></script>
    <!-- 这个vant的js文件需要自己下载下来 -->

  

 var vm = new Vue({
         data(){
                return{
              
                    imgArr:[],
                }
            },
    
    

        methods:{

            imgLook(index){
                    vant.ImagePreview({
                        images:this.imgArr,
                        startPosition: index,
                    });
                }, 

        } 
})

  

posted @ 2022-07-15 14:08  热爱前端的5号机器  阅读(383)  评论(0编辑  收藏  举报