|
学習目標
|
● Viteを用いたVue3プロジェクト環境を構築できる ● Vue3の基本構文(v-bind, v-for, v-model, v-on, 条件分岐など)を理解する ● props/emit を用いたコンポーネント間通信を実装できる ● Vue Router によるページ遷移・パラメータ処理を行える
|
|
学習内容
|
1. Vue3環境構築(Vite)
- 開発環境の準備
- Viteでプロジェクト作成
- 依存ライブラリ導入
- 開発サーバーの起動と動作確認
- フォルダと主要ファイルの役割
2. Vue3の基礎知識
- Vueとは
- Vueコンポーネントの基本
- リアクティブなデータ管理
- ディレクティブ構文
- イベント処理(v-on)
- 双方向バインディング(v-model)
3. コンポーネント分割とデータの受け渡し
- コンポーネントの分割
- 親から子へ値を渡す(props)
- 子から親へイベントを送る(emit)
- 複数の子コンポーネントを配置する
4. ルーティングとSPA
- Vue Routerの導入
- ページ(ルート)とコンポーネントの違い
- ルート設定によるページ切り替え
- ナビゲーションメニューの作成
- provideとinjectによるデータ共有
- パラメータ付きルート
|