Question

因此，前几天我开始使用grapesjs，到目前为止，我还是喜欢它。但是，我遇到了障碍。在画布（#gjs）中，我有一个预设的div容器：

<div id="container"></div>

我可以创建块/将它们添加到块部分（在前端，这将产生以下结构：

    <section class="row">
        <div class="6">Column</div>
        <div class="6">Column</div>
    </section>

我可以将按钮拖动到画布上，但是似乎无法将其拖动到容器中（必须在容器的上方或下方）。然后，我阅读了一些看起来更像我需要做的组件。不幸的是，我不知道如何将组件实际添加到块部分或如何使用它。我可能会走错路了。

Answer 1

您可以使用“ div容器”创建组件

 {
      'id' : '0001',
      'data' : {
             label: `<div>
              <div class="my-label-block">Container</div>
            </div>`,                  
            content:`
                <div id="container"></div>
            `,
            editable: true,
            draggable: true,
            stylable: true,
            category: 'Basics elements',
            selectable: true,
            attributes: {
            class: "fa",
            id: '0001'
            }

      }
    }

带有选项：

    editable: true,
    draggable: true,
    stylable: true,
    selectable: true,

然后，您将可以将“部分组件”拖动到“容器组件”中。

在GrapesJS中向blockManager添加组件

1 个答案: