Klicken Sie auf das Bild im WeChat-Applet, um die Vorschau zu vergrößern. Das Bild wird dann auf der neuen Seite im Vollbildmodus angezeigt

Schritt 1: Definieren Sie die Bildkomponente in wxml und legen Sie das Bindungsereignis fest.

<image src="{
     
     {priceUrl}}" bindtap="imgClick"></image>

Schritt 2: Legen Sie das URL-Array des in der Vorschau anzuzeigenden Bildes in js fest. Denken Sie daran, dass es ein Array sein muss , auch ein Bild muss ein Array sein und kann nicht direkt als Zeichenfolge zugewiesen werden.

2.1 Datendateneinstellung

data: {
    
    
    priceUrl:["cloud://7gerby6t527c7bca.6368-charming815-7gerby6t527c7bca-1316371082/dywfly/price.png"],
  },//需要换成自己的图片链接

2.2 Kompilierung der Bindungsereignisfunktion

imgClick:function(){
    
    
  var imgUrl = this.data.priceUrl;
  console.log('imgClick success',imgUrl)
  wx.previewImage({
    
    
    urls: imgUrl,//imgUrl 必须是需要预览的图片链接列表,只有一张图片也需要是列表
    success:(res=>{
    
    
      console.log('接口调用成功',res)
    })
  })
},

3. Offizieller Aufrufleitfaden der wx.previewImage-Komponente

Fügen Sie hier eine Bildbeschreibung ein

4. Effektvorschau

Seitenanzeigebild
Vorschaueffekt

おすすめ

転載: blog.csdn.net/charmingmm815/article/details/129334425