wxapp img loader

wxapp-img-loader

Ini adalah komponen pramuat gambar asli yang cocok untuk program mini WeChat ( jika Anda menggunakan Taro, silakan pindah ke cabang taro ). Ini telah digunakan di banyak program mini seperti JD Shopping. Langkah-langkah penggunaannya adalah sebagai berikut:

1. Salin direktori img-loader ke proyek Anda

2. Tambahkan kode berikut ke file WXML halaman untuk memperkenalkan template komponen

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

3. Masukkan skrip komponen ke dalam file JS halaman

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

4. Buat instance objek ImgLoader dan teruskan ini (objek Halaman saat ini). Parameter kedua bersifat opsional dan merupakan metode panggilan balik default untuk penyelesaian pemuatan gambar.

 this . imgLoader = new ImgLoader ( this )

5. Panggil metode pemuatan instance ImgLoader untuk memuat gambar. Parameter pertama adalah tautan gambar, dan parameter kedua adalah opsional dan merupakan metode panggilan balik saat gambar dimuat.

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

Catatan: Parameter pertama metode panggilan balik setelah pemuatan gambar selesai adalah pesan kesalahan (null jika pemuatan berhasil), dan parameter kedua adalah informasi gambar (Jenis objek, termasuk src, lebar dan tinggi).

Untuk metode penggunaan, silakan lihat contoh di direktori demo, termasuk skenario memuat satu gambar dan memuat banyak gambar. Efek yang berjalan seperti yang ditunjukkan pada gambar di bawah ini:

-eof-