ホームページ  >  記事  >  ウェブフロントエンド  >  vue ページのコンポーネントは何ですか?

vue ページのコンポーネントは何ですか?

青灯夜游
青灯夜游オリジナル
2022-12-20 13:42:113985ブラウズ

vue ページには 3 つのコンポーネントがあります: 1. テンプレート (template)、つまり、テンプレート タグで囲まれたインターフェイス表示コード (HTML コード)、2. でラップされたビジネス実装コード (js スクリプト コード) script タグ、3 、style タグでラップされたインターフェイス スタイル コード (css スタイル コード)。

vue ページのコンポーネントは何ですか?

#このチュートリアルの動作環境: Windows7 システム、vue3 バージョン、DELL G3 コンピューター。

vue ページは通常、template (テンプレート)、js (スクリプト)、style (スタイル) の 3 つの部分で構成されます。

  • #<script>デフォルトのエクスポート { ビジネス実装コード} </script>

  • ##インターフェイス レイアウト コード (スコープ付きで CSS のグローバル汚染を解決)

##[テンプレート-テンプレート]vue ページのコンポーネントは何ですか?

(1) テンプレートには親ノードを 1 つだけ含めることができます。つまり、最上位の div は 1 つだけです (上の図に示すように、親ノードは #app の div であり、兄弟ノードはありません) (2) はサブルータービューの挿入スロットです。後続のルーティングページがここに表示されます。これは、iframe

[script-JS code]

vue が通常記述されるのと同等です。 es6 でエクスポートされ、データ、ライフ サイクル (マウントなど)、メソッドなどを含めることができるエクスポート デフォルト でエクスポートされます。

[style-CSS style]

スタイルはスタイル タグ でラップされています。デフォルトでは、全世界に影響します。スコープを定義する必要がある場合は、このコンポーネントでのみ機能します。ラベルにスコープを追加する必要があります、外部 CSS 例の紹介:

<style>
    import &#39;./assets/css/public.css&#39;
</style>

[関連する推奨事項:

vuejs ビデオ チュートリアル

Web フロントエンド開発

]

以上がvue ページのコンポーネントは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。