### layouts 目錄中，抽離了使用過程中一些常用的布局 * AdminLayout/**管理后臺布局**，包含了頭部導航，側邊導航、內容區和頁腳，用于系統的整體布局 * PageLayout/**頁面布局**，包含了頁頭（面包屑）和內容區 * CommonLayout/**通用布局**，僅包含內容區和頁腳的簡單布局，項目中用于注冊、登錄或展示頁面 ### 除了基本布局外，通常有很多頁面的結構是相似的。因此，我們把這部分結構抽離為視圖組件 * TabsView/**多頁簽視圖**，包含了 AdminLayout 布局、多頁簽頭和路由視圖內容區 * PageView/**頁面視圖**，包含了 PageLayout 布局和路由視圖內容區 * BlankView/**空白視圖**，僅包含一個路由視圖內容區 ## 如何使用 把視圖組件和路由配置結合一起使用，我們把配置信息抽離在`src/router/config.js`中 ``` export default { name: "基礎數據", path: "basic-data", component: PageView, meta: { title: "基礎數據", }, children: [ { path: "vendor", name: "供應商管理", meta: { title: "供應商管理" }, component: () => import("@/pages/basic/vendor/index"), }, ] } ``` ## modules 不同的模塊在modules下建立不同的js文件，引入到`src/router/config.js`中 ``` import?system?from"@/router/modules/system.js"; ``` ``` const?options?=?{ ??routes: [ ...system ] } ```