技術概述
這個技術是做什么的?
- Element UI一套為開發者、設計師和產品經理准備的基於Vue 2.0的桌面端組件庫
學習該技術的原因
- 在項目beta沖刺階段開發管理員前端需要
技術的難點在哪里
- 組件分類以及元素屬性繁多復雜,並且相關資料較少,有時候遇到問題要花很多時間解決
技術詳述
你是如何實現和使用該技術的
- 通覽一遍官網,了解該工具的大致信息
- 通過教程學習基本的安裝、環境搭建以及各組件的使用
- 學習教程視頻中的實戰訓練
- 自己動手開發
問題和解決
- 當使用表格組件且表頭的內容過長時,過多的字顯得非常不美觀
- 解決方法:為相應的表頭元素加入show-overflow-tooltip屬性,並且一定要規定width屬性的大小,過長的內容就會被隱藏顯示為省略號
- 分頁組件不能正確分頁
- 解決方法:定義一個方法,當換頁時會回調這個方法返回新的頁碼,利用新的頁碼向服務端請求該頁數據即可實現分頁。
- 點擊按鈕組件后不能及時刷新數據
- 解決方法:在按鈕組件所觸發的點擊事件方法中加入向服務端請求數據的方法
總結
對於后端開發人員來說,element ui確實是一個前端開發非常容易上手而且實用的工具。正所謂活到老學到老,學習新知識、接觸新技術都是我們現階段需要做的事。當然學習的過程一定不是一帆風順,就比如我使用的時候大大小小的問題碰到一堆,但是我們一定要先自己動手去排查錯誤,找出問題所在,要利用好網絡資源,前輩們的博客文檔都是精華。自己親自解決錯誤更能加深相關問題的印象。使用vue框架加上element ui組件庫能大大提高開發效率,而且通過修改主題樣式也可以形成自己的風格,總之是一個非常棒的工具。
參考文獻、參考博客
-
element ui使用教程視頻
標題:適合后端編程人員的 ElementUI教程,結合SpringBoot項目案例,已完結!!! 作者:編程不良人 鏈接:https://www.bilibili.com/video/BV1NK4y187XH?p=20
-
正確實現分頁
標題:使用el 作者:未知 鏈接:https://www.dazhuanlan.com/2019/12/05/5de8af700306e/