vant 预览 图片

vant 预览 图片

1.核心代码

  
    
    
      
    

  




import {ImagePreview} from "vant"; // 引入Vant图片预览组件
export default {
  name: 'Png',
  data() {

    return {
      isFixedHeight: true,
      imageLists: ['https://xx.png',
        'https://xx.jpeg'
      ]
    };
  },


  methods: {
    //返回键
    onClickLeft() {
      this.$router.go(-1)
    },
    // 图片预览
    sceneImg(images, index) {
      ImagePreview({
        images: images, //需要预览的图片 URL 数组
        showIndex: true, //是否显示页码
        loop: false, //是否开启循环播放
        startPosition: index //图片预览起始位置索引
      })
    },
  },

  created() {

  }

}