記事ディレクトリ
- 0.効果実証
- 1.Vue3プロジェクトをビルドする
-
- 1.1 vite スキャフォールディングを使用して Vue3 プロジェクトを作成する
- 1.2 ファイルのエイリアスを設定する
- 1.3 エレメントプラスのインストールと設定
- 1.4 ルーティングのインストールと構成
- 2. ログインページ
- 3.バックエンド管理ページ
-
- 3.1 バックグラウンドフレームワークの構築
- 3.2 左側のメニューバー
- 3.3 ヘッダーのユーザー情報
- 3.4 主な内容
- 3.5フィート
- 4. スタティックルーティングの設定
- 5. レコードアクティベーションメニュー
-
- 5.1 el-menu は、default-active 属性をバインドします
- 5.2 クリックイベントをメニューに追加する
- 5.3 アクティベーションメニューの初期化
- 6. 動的ルーティング
-
- 6.1 ログインの成功とデータ保存
- 6.2 ルートナビゲーションガードはルートを動的に構成します
- 6.3 ページを更新した後に空白のページが表示される問題を解決する
- 7. 完全なコード
主な手順:
0.効果実証
1.Vue3プロジェクトをビルドする
1.1 vite スキャフォールディングを使用して Vue3 プロジェクトを作成する
npm create vite@latest vue3-zhifou -- --template vue
作成したプロジェクト フォルダーにコード エディターを入力します。
#安装依赖
npm