ホームページ > ウェブフロントエンド > フロントエンドQ&A > Vue の組み込み命令のコンポーネントは何ですか?

Vue の組み込み命令のコンポーネントは何ですか?

青灯夜游
リリース: 2023-01-14 10:43:07
オリジナル
3296 人が閲覧しました

16 個の組み込み命令があります: v-text、v-html、v-show、v-if、v-else、v-else-if、v-for、v-on、v- bind、v-model、v-slot、v-pre、v-cloak、v-once、v-memo、v-is; v-memo は 3.2 で新しく追加され、v-is は 3.1.0 で廃止されました。 v-show は要素の表示と非表示を制御するために使用され、v-if は式の true または false 値に基づいて要素を条件付きでレンダリングするために使用されます。

Vue の組み込み命令のコンポーネントは何ですか?

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

1. Vue コマンドとは何ですか?

Vue では、コマンドは実際には特別な属性です。

Vue は舞台裏で何かを行います。コマンドに基づいて、具体的に何をするかというと、Vue はさまざまな命令に従ってさまざまな操作を実行します。 # 命令については後述します。特徴は何ですか

#Vue 命令の明らかな特徴は、すべて v- で始まることです (例: v-text

<span v-text="msg"></span>
ログイン後にコピー
##)。 #2、組み込み命令

2.1 Vue の組み込み命令とは何ですか?

組み込み命令Vue に付属しており、そのまま使用できる手順を参照してください

Vue には、#v-text、v-html、v など、合計 16 個の組み込み命令があります。 -show、v-if、v-else、v-else-if、v-for、v -on、v-bind、v-model、v-slot、v-pre、v-cloak、v-once、v -memo、v-is、v-memo は 3.2 で新しく追加され、v-is は 3.1 で追加されました。 .0 では廃止されました。

これらの組み込み命令の基本的な使用法について学びましょう

2.2 16 の組み込み命令の基本的な使用法を理解する

2.2.1 v-text

の役割v-text は要素の textContent を更新します。例:

<h1 v-text="msg"></h1>
ログイン後にコピー

h1 要素の内容は最終です msg

の値に依存します

2.2.2 v-html

は v-text とよく似ていますが、v-html は要素の innerHTML の更新に使用する点が異なります (例:

<div v-html="&#39;<h1>Hello LBJ</h1>&#39;"></div>
ログイン後にコピー

#)。

##内部のコンテンツは通常の HTML

Vue の組み込み命令のコンポーネントは何ですか?2.2.3 v- show

v-show として挿入する必要があることに注意してください。要素の表示と非表示を制御するために使用される式の true または false 値に従って、要素の表示値を切り替えます。例:

#You条件が変化すると、このコマンドが表示または非表示のトランジション効果をトリガーすることがわかります。

Vue の組み込み命令のコンポーネントは何ですか?注: v-show は