问题 #2274✓ 已解决提出于 2019年9月17日作者 tom-sherman4 个反应

如何加载只读组件的子节点?

快速解答作者 pouyamiralayi2

你好!你可以这样设置目标组件的可拖拽属性: 这样,它只能拖入槽内。对只读类型也可以做同样的操作。 如果你需要针对具体情况的进一步帮助,我会非常感激。 干杯。

阅读下方完整回答 ↓

问题

我正在尝试挂载一个只读组件(可拖拽、可丢弃等,均设置为false),并允许用户在里面编辑子组件。

例如,如果我有以下内容

'''html

<div class=“wrapper”> <header>一个头</header>部 <div> 编辑我 </div> <footer>一个基脚</footer> </div> ```

我想在组件内加载所有这些内容,并允许用户拖动新的方块,显示“编辑我”

回答(3)

👍 最有帮助pouyamiralayi2019年9月18日

你好!你可以这样设置目标组件的可拖拽属性:

this.set('可拖拽','slot,slot *')

这样,它只能拖入槽内。对只读类型也可以做同样的操作。 如果你需要针对具体情况的进一步帮助,我会非常感激。 干杯。

pouyamiralayi2019年9月18日

你好! 如果你指的是在没有用户操作的情况下将组件注入编辑器,你可以使用: 更多相关内容[见此处](https://grapesjs.com/docs/api/editor.html#setcomponents)允许用户拖动新的方块,显示“编辑我”。 如果你指的是让只读组件再次可编辑,可以通过以下方式实现: 更多相关内容[见此处](https://grapesjs.com/docs/modules/Components.html#component-instance) 干杯!

tom-sherman2019年9月18日

@pouyamiralayi 谢谢!我已经实现了一个“Slot”组件,并在init方法里覆盖了属性 “JavaScript const Slot = () => ({ 型号:{ 默认值:{ 可调整大小:错误, 内容:'<div style=“min-height: 75px” class=“teditor-wrapper”></div>' }, init() { 如果插槽被加载在只读组件内部,则覆盖这些标志 this.set('droppable', true) this.set('hoverable', true) this.set('可编辑',true) this.set('remova...

相关问答

通过相似的问题讨论继续研究。

与此问题匹配的付费插件

根据问题关键词和标签相关性精选,助你更快交付。

查看全部插件

正在加载付费插件推荐……

免费方案

在以下平台查看开源 GrapesJS 插件: GitHub 或在我们的免费目录中快速搜索。

浏览免费插件 →
高级方案

高级插件提供支持、定期更新和生产就绪的功能——为你节省数天的集成工作。

浏览高级插件 →

浏览插件分类

直接跳转到市场上的插件分类页面。