vue-router のプロパティ

必ず忘れずに、後で使用できるように記録してください。

$router はルーターインスタンスを指し、$route は現在アクティブ化されているルーティング情報オブジェクトで、読み取り専用属性のため変更はできませんが、監視(監視)は可能です。

属性:

$router.app : ルーターで構成された Vue ルート インスタンス

$router.mode : ルーティングモード、ここにハッシュがあります

$router.currentRoute : 現在のルートのルーティング情報オブジェクト。現在一致するルートの情報が含まれます。

方法:

router.addRoutes(routes) : ルーティング ルールを動的に追加します。パラメータは、routes オプションの要件を満たす配列です。

router.beforeEach(to,from,next) : グローバル フロント ガード

router.beforeEach((to,from,next)=>{
     //... 
})

  ルートが変更されると、グローバル フロント ガードが実行され、to、from、next の 3 つのパラメータを受け取ります。これらのパラメータはそれぞれ、進入しようとしているターゲット ルート、現在離脱中のルート、およびコールバック関数 next() を表します。next の実行効果はパラメータによって異なります。next(), 次のフックを実行します。フックが実行されると、ナビゲーション ステータスは確認になります。next(false) は、現在のナビゲーションを中断し、from ルートに対応するアドレスに戻ります。next({path:'/'}) 、「ルーティングアドレスの定義」からジャンプします。next(error) では、エラー インスタンスが渡されると、ナビゲーションが終了し、エラーが router.onError() によって登録されたコールバックに渡されます。

router.beforeResolve() : グローバル解析ガード, ナビゲーションが確認される前、ロック コンポーネントと非同期ルーティング コンポーネントのガードが解析された後に呼び出されます。パラメータはグローバル フロント ガードと同じです。

router.afterEach() : グローバル ポストガード

router.afterEach((to,from)=>{
    //....没有next()函数参数,也不会改变导航本身
})

router.go(n) : window.history.go(n) と同様に整数をパラメータとして受け入れ、ブラウザ履歴を数ステップ前または後ろに移動します

router.push(location) : ジャンプ ナビゲーション メソッド。このメソッドは履歴スタックに新しいレコードを追加します。

router.replace(location) : router.push() と似ていますが、現在の履歴レコードを置き換えるものであり、新しいレコードは追加されません。

router.back() : router.go(-1) と同等

router.forward() : router.go(1) と同等

router.resolve(location) : ターゲット ルートを解析し、アドレス パラメーターを受け取り、場所、ルート、href、およびその他の属性情報を返します。また、現在のデフォルト ルートと現在のルートに追加される追加のパスも受け入れることができます。

router.onReady(callback,[errorCallback]){} : コールバックをキューに入れ、ルートが最初のナビゲーションを完了したときにコールバックを呼び出します。

router.onError(callback) : ルート ナビゲーション中にエラーが発生したときに呼び出されるコールバックを登録します。ただし、呼び出されるときのエラー状況には要件があります。

  1. ルート ガード機能でエラーが同期的にスローされる

  2. エラーは、next(error) を呼び出すことにより、ルーティング ガード関数で非同期的に取得および処理されます。

  3. ルートのレンダリング処理中に、非同期コンポーネントを解析しようとしたときにエラーが発生しました。

Route は、現在のルートに関するさまざまな情報を含むルーティング情報オブジェクトです。ルーティング オブジェクトは不変であり、ルーティング ナビゲーションが成功するたびに新しいオブジェクトが生成されます。router.match(location) の戻り値もルーティング情報オブジェクトであり、ナビゲーション ガードとの間のパラメータもルーティング情報オブジェクトです。

属性:

$route.fullPath : 解析完了後のURL(クエリパラメータとハッシュのフルパスを含む)

$route.path : パス、文字列タイプ、絶対パスに解析される

$route.hash : 現在のルートのハッシュ値 (# 記号付き)。ハッシュ値がない場合は空の文字列です。

$route.name : 現在のルートの名前 (存在する場合) (ルートに名前を付けるために使用されます)

$route.params : キーと値のペアのオブジェクト、ルーティングパラメータ

$route.query : URL クエリパラメータを表すキーと値のペアのオブジェクト

$route.matched : 現在のルートのすべてのネストされたパス セグメントを含むルート レコード (ルート構成配列内のオブジェクトのコピー)

$route.redirectedFrom : リダイレクトがある場合、リダイレクトの発信元のルートの名前。

おすすめ

転載: blog.csdn.net/m0_56683897/article/details/128301144