6/7 Vue.js

自分なりの解釈

 

用意していないURLへのアクセス

index.jsのroutesのオブジェクトに

path '*'を追加する。*を追加することで指定していないすべてのpathを表す。

redirectで遷移先を指定するか、存在しないページ用のコンポーネントを作成して指定する。

こうすることで意図しないURLへのアクセスに予め準備したコンポーネントを表示することができる。

 

ルートのネスト化

railsのルーティングのネストと同じようなイメージ

親のルート情報にchildrenオプションを追加

値に配列 その中にルート情報のオブジェクトを用意することでルートのネストができる。

 

名前つきコンポーネント

router-viewで表示したいコンポーネントが複数ある場合に使用する。

index.jsのルート情報にcomponentsとして値をオブジェクト

名前なしのrouter-viewタグで表示するコンポーネントはdefaultキーで

名前つきのrouter-viewタグで表示したいコンポーネントは任意の名前をキーに設定する。

router-viewタグのname属性値を設定した任意の名前にすることで対応したコンポーネントを差し込むことができる。