ホームページ > 記事 > WeChat アプレット > WeChat アプレットでの画像プリロード コンポーネント wxapp-img-loader の使用の概要
この記事では、WeChat アプレットでの画像プリロード コンポーネント wxapp-img-loader の使用方法について説明します。必要な方は参考にしていただければ幸いです。ヘルプ。
WeChat アプレットは画像のような JS オブジェクトを提供しないため、wxapp-img-loader カスタム コンポーネントで画像のプリロードを WeChat アプレット関数に実装できます。
使用
1. wxapp-img-loader プロジェクトのソース コード (https://github.com/o2team/wxa...) をダウンロードして転送します。 img- ローダー ディレクトリをプロジェクトにコピーします。
2. 次のコードをページの WXML ファイルに追加し、コンポーネント テンプレートを導入します。
<import></import> <template></template>
3 コンポーネント スクリプトを JS ファイルに導入します。ページの
const ImgLoader = require('../../img-loader/img-loader.js')
4. ImgLoader オブジェクトをインスタンス化し、これ (現在の Page オブジェクト) を渡します。これは、デフォルトの画像読み込み完了のコールバック メソッドです。 5. ImgLoader を呼び出す インスタンスのロード メソッドはイメージをロードします。最初のパラメータはイメージ リンクで、2 番目のパラメータはオプションで、イメージがロードされるときのコールバック メソッドです。画像の読み込みが完了したときのコールバック メソッドの最初のパラメータはエラー メッセージ (読み込みが成功した場合は null) で、2 番目のパラメータは画像情報 (src、幅、高さを含むオブジェクト タイプ) です。
this.imgLoader = new ImgLoader(this)
wxapp-img-loader コンポーネントは、単一の画像または複数の画像をロードできます。
実行結果:
その他
wxapp-img-loaderプロジェクトアドレス: https://github.com/o2team/wxa...
以上がWeChat アプレットでの画像プリロード コンポーネント wxapp-img-loader の使用の概要の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。