みなさん、こんにちは、私は新人のフロントエンドです、あなたは他がそれらを繰り返すことはしません、今日あなたと一緒にマイクロ手紙アプレットでweuiの導入と利用を共有するために、昆虫の目覚め私を呼び出すことができ、紙にも何か問題があり、私を修正してあなたに感謝してください。
ストレート件名に:
1.ダウンロードweui
GitHubの入力 https://github.com/weui/weui-wxss/を 以下のページを入力し、プログラムコードをダウンロードするには、赤マーキーをクリックしてください
フォルダに解凍し、weui.wxssたちはweui BANKアイコンのパスを必要とするものです
2.はじめweui
マイクロチャネルプロジェクト(これはで説明されていない)、次のディレクトリを作成するために、開発者ツールを開きます。
良いプロジェクトを作成し、次のステップは、単にプロジェクトのルートディレクトリにすることができますダウンロードし、weui.wxssのフォルダweuiを解凍し、コピー&ペーストすることです
このステップの導入は、導入が完了しました、グローバルapp.wxssに@import「weui.wxss」を追加する必要があり、プロジェクトで使用されるように、終わっていません
3. weui
weui除くGitHubのweuiフォルダからダウンロードした。我々は、使用したいwxssファイルを、非常に重要なフォルダサンプルファイルがあります
Vscodeが直接ファイルに投げ込まれ、私たちは、各コンポーネントのコードを見ることができます。マイクロ手紙アプレットはweuiウェブサイト https://weui.io/ スタイルのショーは、もちろん、私たちはここにweuiアプレット電話でweuiスタイルに直接参照して、ニーズに応じて使用されるコンポーネントを選択することができますが、weui小さなプログラムでweuiは、特定の使用を導入しなかったが、例のフォルダがあります。
我々はバッジの典型的なモジュールを選択するコードを、使用して図Weuiに表示され、対応するコードは実際にあるbadge.wxml各バッジバッジのスタイルマーカーをweui、我々は直接の小さなにペーストbadge.wxmlコードをコピー新しいページtest.wxmlルックでプログラムプロジェクト。
それを保存し、我々はシミュレータで次の結果を見ることができます
到这里我们就已经完成了weui的引入和使用了,接下来只需要进行应用筛选就好,细心的朋友可能还注意到了weui根组件要用class="page",以及骨架和各子组件的class,不过直接复制粘贴也肯定不会出问题的。