ホームページ  >  記事  >  WeChat アプレット  >  WeChat アプレットでの画像プリロード コンポーネント wxapp-img-loader の使用の概要

WeChat アプレットでの画像プリロード コンポーネント wxapp-img-loader の使用の概要

不言
不言転載
2018-10-18 15:22:325762ブラウズ

この記事では、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 コンポーネントは、単一の画像または複数の画像をロードできます。

実行結果:


WeChat アプレットでの画像プリロード コンポーネント wxapp-img-loader の使用の概要

WeChat アプレットでの画像プリロード コンポーネント wxapp-img-loader の使用の概要

その他

wxapp-img-loaderプロジェクトアドレス: https://github.com/o2team/wxa...

以上がWeChat アプレットでの画像プリロード コンポーネント wxapp-img-loader の使用の概要の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はsegmentfault.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。