Vueの類似点とV-ショーの違いとのV-IF

まず、公式の説明:

  1. v-if それは条件ブロック内のイベントリスナーとサブコンポーネントが破壊され、ハンドオーバ処理に適切に再構築されることを保証するので、レンダリング「本当の」条件です。
  2. v-if それは不活性状態は初期レンダリング時に偽である場合は、何もしない-最初の時間は、条件付きのブロックをレンダリングするために開始されたときに、条件がtrueになるまで:。
  3. これとは対照的に、v-show それははるかに簡単ではない-に関係なく、初期条件は、要素が常にレンダリングされ、単にCSSスイッチに基づいてどうなりますか。
  4. 一般的に、v-if 高いオーバーヘッドスイッチング、および  v-show レンダリングの高い初期費用を持っています。非常に頻繁に切り替える必要がある場合はそのため、使用され  v-show 、好ましくは、条件はほとんど動作中に変化しない場合、使用されている  v-if 好ましいです。

第二に、個人的な理解:

  1. 同じポイント:V-ショーとV-場合、コントロールが表示され、要素を非表示にすることができます。
  2. 違い:
  • 本質的に異なる方法
    • 基本的にCSSを設定することで、V-ショーの表示はなし、制御非表示です
    • であれば、V-動的にDOMツリーにDOM要素を追加または削除
  • 違いコンパイル
    • V-showが制御CSSに実際にあります
    • V-場合のハンドオーバ手順が破壊と再適切イベントリスナーの切り替え及びサブアセンブリの内部ローカルコンパイラ/アンロード工程を有します
  • 条件をコンパイルします
    • V-ショーは初期値がfalseで、コンパイルされますが、表示がnoneに設定されているが、それはまた、コンパイル
    • V-場合はfalseの初期値は、コンパイルされません。
  • 演奏
    • V-ショーは対照CSSの後ろに、実際には、一度だけコンパイルされ、破壊と創造を停止しない場合は、V-、それは少し良く、V-ショーのパフォーマンスです。
    • 注意事項:V-ショー、実際の運転画面ため:「」またはなし、CSS自体は表示があります。v-ショーの表示を任せることはできないとき、どれを
    • 要約:ノードへの頻繁なハンドオーバは、(このようにオーバーヘッドが大きく初期オーバーヘッドが小さく、スイッチング、CSSを隠すことによって表示を制御した後、初期にレンダリングするtrueまたはfalseかどうか)は、V-ショーを使用している場合、スイッチが頻繁に必要としない場合場合にV-IFを使用して、ノードは、(遅延ロードとして、最初に偽、レンダリングされませんが、それは要素がディスプレイと隠されるので、初期レンダリング小さいオーバーヘッドを制御するために、DOM追加および削除することによるものであるので、オーバーヘッドを切り替えることは比較的大きいです)

おすすめ

転載: www.cnblogs.com/liutianzeng/p/10978890.html