ユニアプリでプラグインをダウンロードする方法

方法: 1. コンポーネントをダウンロードし、uni-app ルート ディレクトリに抽出します; 2. 「コンポーネント ファイル アドレスからコンポーネント名をインポート」という構文を使用して、指定されたページにコンポーネントをインポートします。コンポーネント オプション Component で定義します。 4. テンプレート ノードで、コンポーネントの使用手順に従い、コンポーネントを呼び出し、値を渡します。

#このチュートリアルの動作環境: Windows 7 システム、ユニアプリ バージョン 2.5.1、DELL G3 コンピューター。

この記事では、badge (デジタル バッジ) を例として、プラグイン マーケットからコンポーネントをダウンロードしてインポートする方法を説明します。

1. コンポーネントをダウンロードします。

プラグイン マーケット

badge の詳細ページから、[ダウンロード] をクリックします。ダウンロードが完了したら、uni-app ルート ディレクトリに解凍します。

2. コンポーネントのインポート

page-a.vue ページで badge を使用し、次に ## を使用する必要があるとします。次のように、#page-a.vue の script ノードの下に badge コンポーネントをインポートします: <pre class="brush:php;toolbar:false">import uniBadge from &quot;@/components/uni-badge/uni-badge.vue&quot;</pre>

3. コンポーネントを定義します

components

オプションで badge コンポーネントを次のように定義します。 <pre class="brush:php;toolbar:false">export default {       data() {           return { /* ... */ }       },       components: {           uniBadge       }   }</pre>から複数のコンポーネントをダウンロードして使用する場合プラグイン マーケット、各コンポーネント これらはすべて

components

オプションで定義し、カンマで区切る必要があります。

4. コンポーネントを使用する

template

ノードで、コンポーネントの使用手順に従い、コンポーネントを呼び出し、値を渡します <pre class="brush:php;toolbar:false">&lt;uni-badge text=&quot;1&quot;&gt;&lt;/uni-badge&gt;   &lt;uni-badge text=&quot;2&quot; type=&quot;success&quot; @click=&quot;bindClick&quot;&gt;&lt;/uni-badge&gt;</pre>完全なコード例は次のとおりです:

  
<script>  
    import uniBadge from &quot;@/components/uni-badge/uni-badge.vue&quot;  
    /* import 导入的其它组件 */  

    export default {  
        data() {  
            return { /* ... */ }  
        },  
        components: {  
            uniBadge,  
            /* 其它组件定义 */  
        }  
    }  
</script>

推奨される学習: Uni-App の入門から実践的なチュートリアルまで

以上がユニアプリでプラグインをダウンロードする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。