wxapp img loader

wxapp-img-loader

這是一個適用於微信小程式的原生圖片預先載入元件（如果你使用的是Taro，請移步至taro 分支），已應用於京東購物等多個小程式。使用步驟如下：

1、將img-loader 目錄拷貝到你的專案中

2、在頁面的WXML 檔案中加入以下程式碼，將元件模板引入

 < import src =" ../../img-loader/img-loader.wxml " />
< template is =" img-loader " data =" {{ imgLoadList }} " > </ template >

3、在頁面的JS 檔案中引入元件腳本

 const ImgLoader = require ( '../../img-loader/img-loader.js' )

4.實例化一個ImgLoader 對象，將this(當前Page 對象) 傳入，第二個參數可選，為預設的圖片載入完成的回呼方法

 this . imgLoader = new ImgLoader ( this )

5.調用ImgLoader 實例的load 方法進行圖片加載，第一個參數為圖片鏈接，第二個參數可選，為該張圖片加載完成時的回調方法

 this . imgLoader . load ( imgUrlOriginal , ( err , data ) => {
    console . log ( '图片加载完成' , err , data . src , data . width , data . height )
} )

註：圖片載入完成的回呼方法的第一個參數為錯誤訊息（載入成功則為null），第二個參數為圖片訊息（Object 類型，包括src、width 及height）。

使用方法可參考demo 目錄的事例，包括載入單張圖片、及載入多張圖片的場景，運行效果如下圖所示：

- eof -