一、流行框架比較

　　作者用過的前端框架不少，曾經還在一個項目中同時使用兩套框架控件（年少無知、效率特慢），所以可供選擇的前端框架有不少：

• easyui：
• • 優點：非常成熟的框架，基于iframe可以進行多線程操作
  • 缺點：由于采用iframe，不優化情況下效率是個問題，同時iframe導致對SEO的支持不是很好，自帶風格不是很符合現在人的口味，自己定義風格有點浪費時間，順便提供下本人自己修改過的風格

• ligerui：與easyui差不多，國人自己寫的產品，有些控件的使用比easyui更舒服

• ace（bootstrap）：風格比較不錯的一套bootstrap框架

• metronic（bootstrap）：現在最火的一套bootstrap框架，不過風格個人不是很喜歡

• beyond admin（bootstrap ）：個人比較喜歡這個范，而且提供的控件也足夠使用，決定就使用它了，而且它本身也是把大部分bootstrap常見的控件融合了起來，比如：jquery.datatables、fonts等

• react native：獨立開發成本比較大
• vuejs：獨立開發成本比較大

?

二、下載對應的beyond admin源碼

• 解壓可以看到對應的目錄

• 打開index.html 可以看到對應的頁面示例，具體的控件示例可以自己細看：

?

?

三、將前端框架融合進ABP

• 拷貝assets到項目的Scripts中

• 更改?MyProject.Web/Views/Shared/_Layout.cshtml 頁面相關源碼

  ?layout代碼

  ?

• 運行程序還是看到以下頁面

• 我們猜測主頁面路由指向問題，找到HomeController控制器，看到以下代碼

• 更改代碼，并添加相關頁面

• 重新運行程序可以看到以下頁面，證明我們遷移成功了

四、示例：

? ? ?我們添加一個控制器（DemoContorller），專門用來放相關測試demo

• 示例1：datatable

　　　　我們直接采用 jquery.datatables來作為我們的首選表格控件，此控件雖然自帶屬性和事件比較少，可擴展性比較好

• 示例2：fonts

? ? ?　　 暫略。

• 示例3：彈出框

　　　　彈出框在modal和layer中考慮了許久，從易用性和使用效果講，最后決定使用 layer來作為彈出框使用。

?

?PS:最近接了個外包，更新的進度會慢點。

https://www.cnblogs.com/samllen/p/7108340.html

總結

以上是生活随笔為你收集整理的使用ABP打造SAAS系统（2）——前端框架选择的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。