Communityコーディング&開発github.com

hyf0/vue-router-best-practices

Vue Router 4 のパターン、ナビゲーションガード、ルートパラメータ、およびルートとコンポーネントのライフサイクル相互作用。

vue-router-best-practices とは?

このスキルは、Vue Router 4 を使用した Vue.js アプリケーションにおけるルーティングのベストプラクティスを提供します。具体的には、名前付きルートの活用、watch を使ったルートパラメータのリアクティブな監視、beforeRouteUpdate や beforeRouteLeave などのナビゲーションガードの正しい使用方法、そしてコンポーネントのアンマウント/再マウントを防ぐテクニックをカバーします。開発者はこのスキルに従うことで、パラメータ変更時のデータ再取得、未保存の変更がある場合のナビゲーションブロック、非同期ルートガードの実装など、Vue Router 4 の一般的な課題を解決できます。主に Vue 3 + Vue Router 4 を対象としており、コード例や実際のシナリオに基づいた説明により、初心者から中級者の開発者が堅牢でパフォーマンスの良いルーティングロジックを構築できるようになります。

対応~Claude Code~Codex CLI~Cursor
Part ofReact
npx skills add https://github.com/hyf0/vue-skills/tree/main/skills/vue-router-best-practices

Installed? Explore more コーディング&開発 skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

vue-router-best-practices は何をしますか?

Vue Router 4 のパターン、ナビゲーションガード、ルートパラメータ、およびルートとコンポーネントのライフサイクル相互作用。

Individual skills in this repo

This repo contains 7 individual skills — each has its own dedicated page.

関連スキル