vueにおけるrouter-linkと従来のaリンクの違い

1790 ワード

Vue-routerは、Vueフレームワークに伴うルーティングシステムであり、優れたルーティングソリューションとしても公認されている.Vue-routerを使用する場合、私たちはよく独自のパスジャンプコンポーネントLinkを使用して、ジャンプを実現します.これは伝統的なものと似ています.しかし、それらにはいったいどんな具体的な違いがありますか?
公式には、は死んだより少し良いと説明されています.理由は以下の通りです.
  • HTML 5 historyモードでもhashモードでも、その表現は一致しているので、ルーティングモードを切り替える場合や、IE 9でhashモードを降格して使用する場合は、変更する必要はありません.
  • HTML 5 historyモードでは、router-linkはクリックイベントを守り、ブラウザがページを再ロードしないようにします.
  • HTML 5 historyモードでbaseオプションを使用すると、すべてのtoプロパティを書く必要はありません(ベースパス).

  • ええと、ブロガーは勉強したばかりの頃、初めて理解できなかったとしか言いようがありません(前の基礎知識がしっかりしていないのではないでしょうか.後で補充しなければならないようです)、自分で調べました.
    W 3 Cではaタグについて次のように説明しています.ラベルは、1つのページから別のページにリンクするためのハイパーリンクを定義します.
  • は1ページから別のページにジャンプするが、ここではマルチビューの1ページWebアプリケーションという概念
  • に反する.
  • aラベルでジャンプすると、ページが再レンダリングされます.つまり、新しいページを再開くことに相当し、視覚的に「点滅」(ローカルの項目ではほとんど見えない)
  • として表現されます.
     
    router-link
  • コンポーネントは、ルーティング機能を有するアプリケーションにおけるユーザのナビゲーションをサポートする(クリック).ターゲットアドレスをto属性で指定することで、デフォルトでは正しいリンクを持つラベルとしてレンダリングされ、tag属性を構成することで別のラベルを生成することができる.
  • router-linkによるジャンプは、新しいページにジャンプしたり、再レンダリングしたりしません.ルーティングで指定されたコンポーネントを選択してレンダリングし、繰り返しレンダリングの「無駄」を回避します.

  • まとめ:と比較すると、router-linkコンポーネントは不要な再レンダリングを回避し、変化した部分だけを更新してDOMのパフォーマンス消費を削減します.
  • Vueの革新的な点は、仮想DOMの概念とdiffアルゴリズムを利用してページの「オンデマンド更新」を実現したことである.
  • Vue-routerはこの点をよく継承しています.再レンダリングは私たちが見たくないことです.どのページにジャンプしても、一度だけレンダリングすればいいからです.コンポーネントは私たちがこの願いを実現するのに役立ちました
  • のラベルを逆に見て、ジャンプするたびにもう一度レンダリングしなければなりません.大きなプロジェクトの中で、これはどんなに恐ろしいことか.私たちの「レンダリング」は多くの「無駄」をし、貴重なDOM性能を大量に消費しました.

  • 以上はすべてブロガーの学習後の見解で、もし間違いがあれば、ブロガーに連絡して更新して、感謝します
    博文参考https://www.jianshu.com/p/3187eaa58f08