權限控制方案 既然是后台權限管理系統，當然少不了權限控制啦，至於權限控制，前端方面當然就是對頁面資源的訪問和操作控制啦。 前端資源權限主要又分為兩個部分，即導航菜單的查看權限和頁面增刪改操作按鈕的操作權限。 我們的設計把頁面導航菜單和頁面操作按鈕統一存儲在菜單數據庫表中，菜單表中包含以下權限 ...

導入項目 打開 Visual Studio Code，File --> add Folder to Workspace，導入我們的項目。 安裝 Element 安裝依賴 Element 是國內餓了么公司提供的一套開源前端框架，簡潔優雅，提供了 vue、react、angular ...

使用 Vuex 管理應用狀態 1. 引入背景 像先前我們是有導航菜單欄收縮和展開功能的，但是因為組件封裝的原因，隱藏按鈕在頭部組件，而導航菜單在導航菜單組件，這樣就涉及到了組件收縮狀態的共享問題。收縮展開按鈕觸發收縮狀態的修改，導航菜單需要根據收縮狀態來設置導航欄的寬度。這樣就需要在收縮狀態 ...

用戶管理模塊 添加接口 在 http/moduls/user.js 中添加用戶管理相關接口。 模擬數據 在 mock/moduls/user.js 中添加用戶管理相關mock接口。 提取根路徑 為了可以統一控制mock的開啟與關閉，把mock的根路徑提取 ...

系統備份還原 在很多時候，我們需要系統數據進行備份還原。我們這里就使用MySql的備份還原命令實現系統備份還原的功能。 后台接口准備 系統備份還原是對數據庫的備份還原，所以必須有后台接口的支持，我們准備好了接口，相關內容可以查閱后台篇。 backup:系統備份創建接口，會在服務端 ...

菜單功能實現 菜單接口封裝 菜單管理是一個對菜單樹結構的增刪改查操作。 提供一個菜單查詢接口，查詢整顆菜單樹形結構。 http/modules/menu.js 添加 findMenuTree 接口。 菜單管理界面 菜單管理界面是使用封裝的表格樹組件顯示菜單結構，並提供增刪 ...

國際化支持 1.安裝依賴 執行以下命令，安裝 i18n 依賴。 2.添加配置 2.1 在 src 下新建 i18n 目錄，並創建一個 index.js。 in ...

技術基礎 開發之前，請先熟悉下面的4個文檔 vue.js2.0中文, 優秀的JS框架 vue-router, vue.js 配套路由 vuex，vue.js 應用狀態管理庫 Element，餓了么提供的UI框架 開發環境 Node JS（npm ...