需求描述:现有的online表单配置的页面属性-控件类型不满足实际开发 需要扩展自定义的控件 示例说明:扩展一个下拉多选控件

步骤如下:
  • 1、新增控件类型

    找到前端vue文件 src\views\modules\online\cgform\tables\PageAttributeTable.vue 修改fieldShowType配置,增加一个option,代码如下

扩展控件类型 - 图1

  • 2、新增Widget

    在文件夹src\components\online\autoform\view\下新建一个vue文件,SelectMultiWidget 【文件取名建议:以Widget结尾】页面代码如下:

扩展控件类型 - 图2

  • 3、注册Widget

    在src\components\online\autoform\index.js中新增代码如下:

扩展控件类型 - 图3

  • 4.功能测试
  • 4-1 配置表单的某一字段的控件类型

扩展控件类型 - 图4

  • 4-2 配置表单的某一字段的字典信息

扩展控件类型 - 图5

  • 4-3 测试表单显示结果如下

扩展控件类型 - 图6