FormBuilder.js: 如何继承radio-group控制?

FormBuilder.js: How to inherit from radio-group control?

我正在尝试为 FormBuilder 创建一个新控件,它基本上是一个单选组控件(我的意思是它具有与单选组控件相同的配置)但我需要定义一个自定义 build() 和onRender() 方法。

我阅读了很多次文档,但无法正常工作,这是我正在尝试做的一个简单示例。

if (!window.fbControls) window.fbControls = new Array();
window.fbControls.push(function (controlClass) {

  class controlMultipleObjects extends controlClass {

    static get definition() {
      return {
        icon: '\uD83D\uDD89',
        i18n: {
          default: 'Control Multiple Items'
        }
      };
    }

    configure() {
      // this.js = '//cdn.jsdelivr.net/npm/signature_pad@2.3.2/dist/signature_pad.min.js';
    }

    /**
     * build a text DOM element, supporting other jquery text form-control's
     * @return DOM Element to be injected into the form.
     */
    build() {

      this.dom = this.markup('div', null, {class:'multipleObjectsController', id: this.config.name});

      return this.dom;
    }

    onRender() {
    }
  }

  // register this control for the following types & text subtypes
  controlClass.register('multipleObjects', controlMultipleObjects);
  return controlMultipleObjects;
});

这基本上有效,新控件 'multipleObjects' 显示在表单生成器中,但是当打开控件的配置时它只显示 'Value' 项。我需要显示多个值,就像单选组、select 或 select 组控件一样。

有什么想法吗?

谢谢!

看看https://formbuilder.online/docs/formBuilder/options/typeUserAttrs

您需要像这样在 formBuilder 中传递选项:

const options = {
    typeUserAttrs: {
        multipleObjects: {
            options: {
                label: 'Class',
                multiple: true,
                options: {
                    'red form-control': 'Red',
                    'green form-control': 'Green',
                    'blue form-control': 'Blue'
                },
            },
        },
    },
}

$("#fb-editor").formBuilder(options)