wx.previewImage 方法用來預(yù)覽圖像，所謂預(yù)覽，就是讓圖像全屏顯示。該方法的 Object 類型參數(shù)的屬性在事件觸發(fā)上和 wx.chooseImage 方法相同，只是 wx.previewImage 方法需要設(shè)置一個 urls 屬性，該屬性為 StringArray 類型，表示用于預(yù)覽的圖像文件路徑集合，其實就是上一節(jié)代碼中 res.tempFilePaths 屬性的值。

本節(jié)會改進上一節(jié)的程序，讓點擊 <image> 組件后，可以預(yù)覽圖像。首先需要為 <image> 組件設(shè)置一個點擊事件函數(shù)（ previewImage ），代碼如下：

<image bindtap="previewImage" src="{{imageSrc}}" mode="aspectFit"
style="margin-top:10px;width: 300px; height: 300px; background-color: #eeeeee;" />

接下來需要在 data 中定義一個 imageList 屬性，用來保存選中的圖像臨時路徑，在選中圖像后（ onClick 函數(shù)），需要設(shè)置 imageList 屬性的值。最后需要實現(xiàn) previewImage 函數(shù)。完整的代碼如下：

var app = getApp()
Page({
  data: {
    imageSrc: '',
    imageList: [],
  },
  //選擇圖像
  onClick: function () {
    var that = this;
    wx.chooseImage({
      count: 2,
      sizeType: [ 'original','compressed'],
      sourceType: ['album', 'camera'],
      success: function (res) {
              that.setData(
          {
            imageSrc: res.tempFilePaths[0],
            imageList:res.tempFilePaths
          }
        )
        console.log(res.tempFilePaths.length)
      }
    })
  },
  previewImage: function (e) {
    var current = e.target.dataset.src
 
    wx.previewImage({
   
      urls: this.data.imageList
    })
  }
})

在真機上運行小程序后，選中一個或多個圖像，然后點擊 <image> 組件，就會進入圖像預(yù)覽窗。