前言
不知道各位 coder 有沒有碰到過許多重複的業務需求,比如排版相類似的報表,只不過是順序稍微換了一下,就是一個新的頁面,雖然基於模板思想來寫的話也能減少不少程式碼,但是相對的不那麼方便,筆者最近就是碰到了類似的需求,忍無可忍,遂該專案便誕生了了。
正文
演示
gif 圖稍大,若載入不出來請稍等片刻 (..•˘_˘•..)
專案地址
如果覺得我有幫到什麼忙的,歡迎 star,我會更有動力的 (ง •̀_•́)ง。
使用方法
詳細的開發指南和配置引數就不在此贅言,在專案文件中已經有詳細的說明,這裡只是稍微介紹一下。
- 首先該專案分為兩個頁面,一個是拖拽排版頁面,一個是預覽頁面,佈局都在排版頁面中完成
- 在排版頁面中,左側的
+
用來新增行(row
),右側的+
用來新增列(col
),或稱元件 - 所有的操作皆可通過拖拽完成,在完成排版之後點選
>>
按鈕即可預覽生成的頁面 - 在預覽頁面中有純前端實現的
pdf
匯出功能,具體思想是將dom
轉為canvas
,再匯出為圖片,再將圖片轉為pdf
- 當前的資料傳輸方式是將佈局儲存在了
localstorage
中得以實現的 - 實際專案中建議的流程是先在排版頁面中新建或者修改佈局,在預覽頁面再儲存或者更新佈局
後語
減少人類重複無意義的工作,這就是程式設計師存在的意義,同時也是我的目標,不可否認該專案裡面還是有不少冗餘程式碼,一點點修改一點點完善,也歡迎大傢俬信我交流交流,撒花。
頁尾
程式碼即人生,我甘之如飴。
我在這裡 gayhub@jsjzh 歡迎大家來找我玩兒。
歡迎小夥伴們直接加我,拉你進群一起學習前端呀,記得備註一下你來自哪裡哦。