在 grapessj 编辑器中渲染第三方组件

Question

你好，

我们希望渲染第三方控制。这是一个普遍性的问题，我们想知道我们是否走在正确的方向上。为了渲染控制，我们需要使用第三方技术（Vue、React或类似框架）。这两个框架有一个共同的问题：它们在运行时渲染组件的能力滞后。

例如，Vue 的问题在于它移除了包装节点及其子节点。完全可以重建HTML结构。然而，Backbone似乎不喜欢这个版本，模型丢失了，因此编辑器也无法正常工作。

或者，也可以在其组件的渲染函数中渲染组件。但Vue可能做不到。

我还没用 React 测试过 Grapes，但有可能 React 能够在运行时编译模板。

你有什么建议吗？你有没有我们可能忽略的方法？

第二个问题，我想知道是否可以在组件内部从编辑器中挂钩事件。我想在触发“canvas：drop”事件时执行一些代码。目标是通过拖放和以方块形式调整大小来实现绝对定位，直到路线图功能实现。

提前感谢你的回复。

artf · Accepted Answer

如果你用带编译器的版本，Vue 在运行时就能编译。就像这个组件 https://github.com/alexjoverm/v-runtime-template

第二个问题，我想知道是否可以从组件内部钩入编辑器的事件

是的，你可以通过“this.em”从组件访问编辑器模型。 “''js someMethodInComponent（） { cont { em } = this; em.on（“某事件”，...）; em.once（“某事件”，...）; em.trigger（“某事件”）; // ... }

HakuTheWolfSpirit · Answer

你好，谢谢你的回答。如果你用带编译器的版本，Vue 会在运行时编译。就像这个组件 https://github.com/alexjoverm/v-runtime-template Vue的问题在于，没有一种方法能让我输入字符串作为参数，输出html。 我已经在StackOverflow上问过这个问题，希望不久后能得到答案。是的，你可以通过 this.em 从 components 访问编辑器模型 👍

artf · Answer

Vue 的问题在于，没有真正的方法能让我输入字符串作为参数，输出 html。我已经在StackOverflow上问过这个问题，希望不久后能得到答案。

是的，但你总可以创建一个元素，在运行时挂载 Vue 实例，然后获取它的 HTML 内容

在 grapessj 编辑器中渲染第三方组件

问题

回答（3）

相关问答

在画布内添加自定义HTML

从面板按钮中选择并聚焦一个HTML元素

远程存储的自动保存不会发送网络请求

不能用 React JS

与此问题匹配的付费插件

相关教程

🚀 Introducing GrapesJS Email Blocky: The Ultimate Email Block Library for GrapesJS

浏览插件分类