這個(gè)簡(jiǎn)單易上手的后臺(tái)模板，新手程序員務(wù)必收藏好！

時(shí)間：2023-06-15 05:03:02 | 來(lái)源：網(wǎng)站運(yùn)營(yíng)

時(shí)間：2023-06-15 05:03:02 來(lái)源：網(wǎng)站運(yùn)營(yíng)

這個(gè)簡(jiǎn)單易上手的后臺(tái)模板，新手程序員務(wù)必收藏好?。? 大家好，我是為廣大程序員兄弟操碎了心的小編，每天推薦一個(gè)小工具/源碼，裝滿你的收藏夾，每天分享一個(gè)小技巧，讓你輕松節(jié)省開發(fā)效率，實(shí)現(xiàn)不加班不熬夜不掉頭發(fā)，是我的目標(biāo)！

今天小編推薦一款后臺(tái)模板——sa-admin,一個(gè)無(wú)需腳手架即可直接運(yùn)行的后臺(tái)模板。

優(yōu)點(diǎn)

• 上手簡(jiǎn)單：提供完整徹底的封裝，不用修改一行源代碼即可輕松集成
• 示例全面：提供大量常見(jiàn)增刪改查示例，提高你的生產(chǎn)力

框架選型

• JS引擎：Vue @2.6.10
• UI框架：Element-UI @2.13.0
• web彈層：layer @3.1.1
• 切頁(yè)動(dòng)畫：Swiper @4.5.0
• 即使以上幾個(gè)框架你都沒(méi)接觸過(guò)，只要你認(rèn)真閱讀一遍文檔說(shuō)明，也可以快速上手本模板

功能

• 基礎(chǔ)
• 架構(gòu)：基于iframe，無(wú)后臺(tái)代碼，純html模板，可方便的適配任何后端語(yǔ)言
• 模板：提供大量常見(jiàn)示例，以及各種表單的書寫方式，助你快速CRUD
• 菜單：支持一、二、三級(jí)菜單，并開放一系列接口方便的使用js操作菜單
• 折疊：折疊或收縮菜單，并且監(jiān)聽(tīng)窗口大小變化，在拉伸窗口時(shí)自動(dòng)折疊或收縮菜單，自動(dòng)響應(yīng)式
• 搜索：智能索引，快捷搜索打開某個(gè)菜單
• 切換：集成swiper動(dòng)畫，滑動(dòng)、淡入、方塊、3D流、3D翻轉(zhuǎn)，五種高大上切換動(dòng)畫，任你選擇！
• 主題：目前保留八種主題：藍(lán)色、綠色、白色、灰色、灰色-展開、pro鈦合金、沉淀式黑藍(lán)、簡(jiǎn)約式灰藍(lán)（切換主題時(shí)，可自動(dòng)保存你的喜好，下次打開時(shí)仍然有效）
• 便簽：彈出窗口便簽，一個(gè)臨時(shí)小便簽，可記錄一些臨時(shí)資料
• 全屏：可以在全屏/非全屏之間自由切換


• tabbar欄：
• 卡片堆積：多卡片自動(dòng)堆積，與菜單雙向關(guān)聯(lián)，切換tab卡時(shí)自動(dòng)顯示左側(cè)菜單
• 拖動(dòng)手勢(shì)：tab卡支持拖拽手勢(shì)，上拖新窗口打開、下拽懸浮打開、左拽快速關(guān)閉
• 雙擊全屏：當(dāng)卡片屬于懸浮狀態(tài)時(shí)，雙擊標(biāo)題區(qū)域可以快速全屏，再次雙擊取消全屏
• 右鍵菜單：在tab上右擊，可以：刷新、復(fù)制、關(guān)閉、關(guān)閉其它、關(guān)閉所有、懸浮打開、新窗口打開、取消
• 雙擊菜單：雙擊tabbar空白處，可以顯示添加新tab窗口
• 保留高度：切換卡片時(shí)，可自動(dòng)保留上個(gè)卡片的滾動(dòng)條高度

• 開放接口
• 開放一系列api，助你方便的使用js操作tabbar欄，具體請(qǐng)查看集成文檔
• 錨鏈：tab切換自動(dòng)更改hash錨鏈，同時(shí)監(jiān)聽(tīng)錨鏈改變tab，可靈活的用鼠標(biāo)前后鍵切換tab窗口 （如不需要此功能可在初始化時(shí)關(guān)閉）
• 窗口：可在初始化時(shí)，設(shè)置是否顯示tabbar欄，來(lái)控制它是多窗口還是單窗口，具體見(jiàn)使用文檔
• 更新：功能不斷更新中... 你有好的想法也可以告訴我，加群一起交流吧
• 文檔：使用說(shuō)明，見(jiàn)文檔

預(yù)覽

結(jié)尾

本期就分享到這里，我是小編南風(fēng)吹，專注分享好玩有趣、新奇、實(shí)用的開源項(xiàng)目及開發(fā)者工具、學(xué)習(xí)資源！希望能與大家共同學(xué)習(xí)交流。