1. 程式人生 > >小程式實現圖片預覽功能

小程式實現圖片預覽功能

為什麼要實現小程式圖片預覽功能?
因為有些圖片太小,我們需要將圖片放大,才能檢視圖片上的資訊。
為了實現這項功能我們需要呼叫該函式:

var current = e.target.dataset.src;
    //預覽圖片
    wx.previewImage({
      current: current,
      urls: this.data.product.photoUrls,
    });

current:表示當前需要預覽的圖片,(預設圖片陣列的第一張)
urls:表示圖片的陣列
當然你需要在頁面繫結事件

<image mode="widthFix"
data-src="
{{item}}" src="{{item}}" bindtap="previewImage" />

data-src:表示當前圖片的路徑,這個是必須,否則無法獲取當前圖片的src,