html使用组件:

<div class="cell photo" @click.stop="imagesPreview(img.url)" :style=" 'background-image: url('+ img.url +')  " ></div>
<van-image-preview v-model="show" :images="images1" v-myOn:click="fn"></van-image-preview>
js使用自定义指令:
export default {
  name: "",
  data() {
    return {
      images1: [],
      show: false,
    };
  },
directives: {
    myOn: {
      bind(el, binding, vnode) {
        const event = binding.arg;
        const fn = binding.value;
        el.addEventListener(event, fn);
      },
    },
  },
  methods: {
    fn() {
      this.show = false;
    }
 
    imagesPreview(img) {
      this.images1 = [img];
      this.show = true;
    },
  }
}

相关文章:

  • 2021-09-29
  • 2023-01-14
  • 2021-10-01
  • 2022-12-23
  • 2021-08-17
  • 2021-11-05
猜你喜欢
  • 2022-12-23
  • 2022-12-23
  • 2021-12-21
  • 2022-01-13
  • 2021-07-07
相关资源
相似解决方案