目前Vue3已經支持兩種模式：Online在線模式 和 GUI模式代碼生成。
JeecgBoot版本要求： 3.2.0+ ( 提供了vue3、vue3Native模板目錄 )
第一步：通過online表單在線建表
jeecg提供了在線建表的功能，找到菜單：
在線開發 -> Online表單開發配置完表單，點擊同步數據庫，會在數據庫生成表。
第二步：Online表單字段控件配置
online表單字段的控件類型，支持 下拉、radio、checkbox、選擇人、選擇部門、popup、下拉搜索、省市縣、下拉多選等，已經滿足在線低代碼開發需求 ， Online表單專題視頻
第三步. 生成代碼界面
點擊online表單上方的代碼生成按鈕，選中需要生成的表單，就可以調出代碼生成的界面
-
3.1 單表界面
-
3.2 一對多界面
一對多的online表代碼生成界面，標註的都是可以修改的，正常情況只需要修改包名，其它可以根據自己情況修改 -
3.3 online表單一對多，外鍵配置注意
// 子表外鍵配置說明7
a) 子表引用主表主鍵ID作爲外鍵，外鍵字段必須以_ID結尾，例如 ORDER_ID
b) 主表和子表的外鍵字段名字，必須相同（除主鍵ID外）;
- 3.4 生成代碼動圖演示
![]()
第四步. 生成代碼結構
如果選擇生成代碼目錄，直可以接選擇到生成到那個模塊，這樣java代碼不需要再手工調整，只需要將前端代碼複製到前端vue項目中。
前端如下：
- 4.1 vue3模板目錄
需要哪個vue版本的頁面，複製哪個目錄下的代碼到前端項目即可
- 4.2 vue3Native模板目錄
- vue3目錄表單採用的是vben json結構寫法，這種寫法簡單表單比較方便也好維護，但是複雜表單就麻煩了。所以提供了原生寫法表單模板
- vue3Native目錄下的表單，採用原生antd寫法，非vben封裝表單。
- 請用戶按照自己的需求靈活選擇。
- 4.3 前端代碼存放位置
需要放在view文件夾下面
第五步：配置菜單SQL
vue3目錄下會生成插入菜單的sql，直接執行即可。
頁面對應的前臺目錄爲
views/代碼生成時寫的包名文件夾下，如果你想更改到其他目錄，需要修改sql中component字段對應的值
- 5.1 動態效果圖演示
![]()
- 第六步：角色授權
生成代碼後通過角色授權菜單，授權成功後刷新頁面即可看見新增的菜單
