希塔資料：搭建定製管理平台及報表系統(目錄)zhuanlan.zhihu.com
由於這一塊從設計到編碼涉及的篇幅會很長，所以分開一點一點的講解，如何使用vue以及django來實現這樣乙個系統，如果大家有興趣，關注一下我們，收藏一下專欄，謝謝！
搭建定製管理平台及報表系統zhuanlan.zhihu.com
使用vue製作自定義表單
自定義表單有多種：
單錶自定義表單（相對比較簡單，例如：問卷，報表資料來源等）
單錶自定義表單，字段可以與其他自定義表關聯（比第一種情況稍複雜）
子母表自定義表單，例如訂單系統（這個情況就比較複雜了，需要考慮的東西也更多）
這篇主要說第一種情況
在設計這個自定表單的時候，想要能夠控制的內容包含基礎屬性、外觀/位置、約束，所以在屬性上也按照這三大類進行的劃分
基礎屬性
基礎屬性中基本上都比較好理解，要解釋一下的就是能否重複，這個就和資料庫中的主鍵類似，相當於乙個資料唯一標識，唯一標識可以是乙個字段組成，也可以是多個字段
外觀/位置
顯示
可能這個屬性大家看了後會覺得是多餘的，既然要建立某個字段，幹嘛還要設定顯示不顯示呢？因為在某些時候我們希望欄位在滿足某乙個條件或者某個開關被觸動後，然後才顯示，例如我們見到的問卷系統中，假如有這麼一道題：
你今天午飯吃的什麼？
自帶麥當勞
其它其它:________________________
就好比這個問題，如果說預設這個問題不是選中的3其它，而是1自帶，那麼其它的補充說明通常會隱藏，等到使用者選中了3以後，再給顯示出來
另起一行
設定這個的原因是因為考慮到系統不僅僅是用來當作問卷使用的，而且我們也不是專門提供問卷服務的，這只是我們乙個很區域性的功能，所以我們就需要考慮到表單的布局問題，問卷的布局基本上就是垂直的一行乙個問題，但是表單複雜的表單布局，就不一樣了，他需要能夠很好的控制欄位的位置，例如在一行上顯示了2個字段以後，需要下乙個字段直接布局到下面一行，那麼我們就可以開啟另起一行，換行還有其它的方式，後面會介紹
問卷布局
表單布局
寬度
表單的布局採用的是響應式布局，1/6、1/3、1/2 就是一行總寬度的多少，自適應，就是和行同寬，之前提到過，除了另起一行外，還有其它方式可以換行
高階屬性
文字/整數/小數
基礎屬性基本是一樣的，而且比較好理解，所以不做過多介紹
日期
單選/多選
單選多選的屬性相對比較複雜一些，單選多選中，可以自定義選項，以及預設選中，單選只能預設選中一項，多選可以預設選中多項
新增動作
你今天午飯吃的什麼？
自帶麥當勞
其它 其它:________________________
一開始我們把其它的補充說明設定為了隱藏，這個時候我們希望通過選中了第三項後把其它的補充說明顯示出來，那麼我們可以像下圖一樣新增乙個動作，選擇乙個字段，然後動作為顯示，那麼當使用者在這個字段選中到這一項的時候就會去執行這些動作，動作可以是乙個也可以是多個
最後再補充乙個設計的介面
vue中使用element ui自定義表單驗證
template dataform rules rules model dataform label width 300px prop phone inp v model dataform.phone auto complete true el input el form item el form ...
VUE表單自定義驗證常用正則
表單驗證處呼叫phoneverify自定義方法。rules phoneverify自定義方法正則使用。手機號驗證 var phoneverify rule,value,callback d 1 3584 d if reg.test value callback 密碼至少包含 數字和英文，長度6 20...
vue 使用自定義元件
新建專案，ctrl r進入cmd，切換至工作目錄 c users asus f f cd study f study cd vue f study vue cd demo 安裝 vue cli npm install g vue cli?target directory exists.continu...