【Vue】$router.pushとは？Vueで画面遷移する方法
$router.push
$router.push$router.push は、Vue.js の公式ルーターである Vue Router のメソッドで、プログラム的に別のルート（ページ）に移動するために使用されます。
router.pushを使うことで、ユーザーを指定したパスにリダイレクトできます。
使い方
this.$router.push('/routerPushExample/vuePath');
ブジェクト形式でクエリパラメータや名前付きルートを指定することもできます。
// パスを使って移動
this.$router.push({ path: '/routerPushExample/vuePath' });
// 名前付きルートを使って移動
this.$router.push({ name: 'routeName', params: { userId: 123 } });
APIを実行して成功したら、画面遷移をおこなった例です。
await exampleAsyncFunction().then(() => {
this.$router.push('/routerPushExample/vuePath');
});
スポンサードサーチ
実行結果
$router.pushの処理が成功すると、URLにリダイレクトされると、Vue Routerは対応するコンポーネントを探し、そのコンポーネントをレンダリングします。
/routerPushExample/vuePath.vue
/routerPushExample/vuePathのvueコンポーネントが呼び出されることになります。
