使いやすく、拡張しやすいミニプログラム UI ライブラリ
使用
ZanUI-WeApp を使用する前に、WeChat の公式ミニ プログラムの簡単なチュートリアルとミニ プログラム フレームワークの概要を必ず学習してください。
次に、Bower を使用して ZanUI-WeApp をプロジェクトに追加します。
独自の ZanUI-WeApp をフォークして、より安定したコードとより便利なカスタマイズを取得することもできます。
zanui-weapp/dist/index.wxss を app.wxss に直接導入することをお勧めします。
コンポーネント分類の概要
さまざまな機能に応じて、コンポーネントは大きく 2 つのカテゴリに分類できます。
1. 通常の引用
たとえば、ボタン コンポーネントがある場合、ボタン カスタム コンポーネントをページに導入するだけで済みます。
{ "usingComponents": { "zan-button": "/path/to/zanui-weapp/dist/btn/index" } }
<!-- example/btn/index.html --> <zan-button>ボタン</zan-button>
2. APIコンポーネント
たとえば、Toast コンポーネントでは、最初にページにカスタム コンポーネントを導入する必要があります。後でロジックが実行されているときに、メソッドを呼び出すことでメソッドを直接表示できます。
{ "usingComponents": { "zan-toast": "/path/to/zanui-weapp/dist/toast/index" } }
<zan-toast id="zan-toast-test"></zan-toast>
対応する Toast 関数をページに導入すると、それを直接呼び出して Toast を表示できます。
// example/toast/index.js const Toast = require('/path/to/zanui-weapp/dist/toast/toast'); Page({ showToast() { Toast({ セレクター: '#zan-toast-test', メッセージ: 'トーストコンテンツ' }); } });
このサイトのすべてのリソースはネチズンによって提供されたもの、または主要なダウンロード サイトによって転載されたものです。ソフトウェアの整合性をご自身で確認してください。このサイトのすべてのリソースは学習の参考のみを目的としています。商業目的で使用しないでください。そうでない場合は、すべての結果に対して責任を負うことになります。侵害がある場合は、削除するためにご連絡ください。連絡先情報: admin@php.cn
関連記事
![Tailwind CSS を使用して素晴らしいカレンダー アイコンをすばやくデザインする](https://img.php.cn/upload/article/001/246/273/172929654386514.jpg)
19 Oct 2024
Tailwind は、実稼働ビルドで未使用の CSS を削除することでスタイルを合理化し、ファイル サイズを削減する、ユーティリティ優先の強力な CSS フレームワークです。この記事では、Tailwind の強力な機能を使用して、スタイリッシュなカレンダー アイコンを簡単に作成する方法を説明します。
![jQuery を使用して画像をすばやくプリロードするにはどうすればよいですか?](https://img.php.cn/upload/article/001/246/273/173482153067295.jpg)
22 Dec 2024
jQuery を使用した画像のプリロード: 簡単なガイド複雑な画像のプリロード スクリプトが利用可能ですが、この記事では簡潔で簡単なガイドを提供します。
![パック拡張を使用して C パラメータ パックを正しくループするにはどうすればよいですか?](https://img.php.cn/upload/article/001/246/273/173594050188364.jpg)
04 Jan 2025
パック拡張によるパラメータ パックのループ提供されたコード スニペットでは、以下を使用して可変長パラメータ パックをループします。
![SQL インジェクションやその他の落とし穴を避けるために、PHP で MySQL 拡張機能を安全に使用するにはどうすればよいですか?](https://img.php.cn/upload/article/001/246/273/173398123199582.jpg)
12 Dec 2024
MySQL 拡張機能を使用した安全な MySQL クエリはじめにPDO の普及にもかかわらず、mysql_* ファミリの関数は依然として一般的な選択肢です。
![リフレクションを使用して Go インターフェイスの空の値をすばやく検出するにはどうすればよいですか?](https://img.php.cn/upload/article/001/246/273/173413049080263.jpg)
14 Dec 2024
Go のリフレクションによる空の値の迅速な検出int、string、bool、またはその他の値を格納するインターフェイスを扱う場合、多くの場合...
![SQLite で WHERE IN ステートメントを正しく使用してエラーや SQL インジェクションを回避するにはどうすればよいですか?](https://img.php.cn/upload/article/001/246/273/173586622090667.jpg)
03 Jan 2025
「WHERE _ IN _」ステートメントを理解するSQLite で WHERE IN ステートメントを使用する場合、正しい構文と使用法を理解することが不可欠です。
![Python の Tkinter を使用してすばやく簡単なファイル ダイアログを実装するにはどうすればよいですか?](https://img.php.cn/upload/article/001/246/273/172990239119500.jpg)
26 Oct 2024
Tkinter を使用した迅速かつ簡単なファイル ダイアログ: Python ソリューションファイル選択に raw_input を使用する欠点を軽減するには、...を組み込むことを検討してください。
![GCC を使用してリソース ファイルを実行可能ファイルやライブラリに埋め込むにはどうすればよいですか?](https://img.php.cn/upload/article/001/246/273/173411089433267.jpg)
14 Dec 2024
GCC を使用した実行可能ファイルおよびライブラリへのリソース ファイルの埋め込み実行可能ファイルおよび共有ライブラリ内にリソース ファイルを埋め込むと、機能を強化できます。
![トップ10使用しやすく信頼性の高いデジタル通貨取引ソフトウェアランキングが推奨される2025](https://img.php.cn/upload/article/000/000/083/67a2fcb95e8a8437.jpg)
08 Feb 2025
活況を呈するデジタル通貨の時代には、有用で信頼性の高い取引ソフトウェアを選択することが重要です。この記事では、Binance、Coinbase、FTX、Kraken、Huobi Global、Kucoin、Crypto.com、Phemex、Gemini、Gate.ioなど、2025年にトップ10の最も信頼できるデジタル通貨取引ソフトウェアを推奨しています。これらのプラットフォームは、ユーザーベース、暗号通貨の選択、機能、セキュリティ、コンプライアンス、取引手数料などの要因に基づいて評価され、さまざまなニーズを満たすための最良の選択を提供します。
![See all articles](/static/imghw/down_right.png)
![](/static/imghw/taglogo.png)
ホットツール Tags
![](/static/imghw/taglogo.png)
Hot Tools
![WeChat ミニプログラムのデモ: 模倣モール](https://img.php.cn/upload/webcode/000/000/000/587dbb2750c82657.png)
WeChat ミニプログラムのデモ: 模倣モール
WeChat ミニ プログラム デモ: モールを模倣しており、簡単に始めることができ、モールのいくつかの基本機能をうまく紹介しています。
![要点: アンカーのような機能を実装する](https://img.php.cn/upload/webcode/000/000/000/587db82bf0392490.png)
要点: アンカーのような機能を実装する
誰もが必要とする同様のアンカー機能に加え、一部のテイクアウトアプリの典型的な注文機能も実装されています。
![WeChat ミニプログラムのデモ: Lezhu](https://img.php.cn/upload/webcode/000/000/000/587db8c2f3a51421.png)
WeChat ミニプログラムのデモ: Lezhu
WeChat ミニ プログラムのデモ: Lezhu: 位置ベースの便利なアプリケーションに似ており、Zhang Xiaolong のミニ プログラムの精神にいくらか似ています。
![WeChat ミニ プログラム ゲームのデモでは、さまざまなカラー ブロックが選択されます](https://img.php.cn/upload/webcode/000/000/000/587db4b7c7309646.png)
WeChat ミニ プログラム ゲームのデモでは、さまざまなカラー ブロックが選択されます
WeChat ミニ プログラム ゲームのデモでは、さまざまなカラー ブロックが選択されます
![WeChat アプレットのデモ: カルーセル画像の変換](https://img.php.cn/upload/webcode/000/000/000/587db87c32a47793.png)
WeChat アプレットのデモ: カルーセル画像の変換
カルーセル チャートのスタイル変更、小さなプログラムで実装されたシンプルなカルーセル チャート、簡単に作成
![](/static/imghw/taglogo.png)