问题 #1408💬 已回答提出于 2018年9月6日作者 Siddharth-ss422791 个反应

为什么文本元素被转换成了框?

快速解答作者 artf1

@Siddharth-ss42279 如果你需要编辑用GrapesJS创建的模板,你不应该使用它的HTML......你应该导入它的 JSON......所以你做错了 就像做这个 “''js el.addEventListener('点击',...); someOtheEl.innerHTML = el.innerHTML; ``` 然后抱怨为什么你的'El'没有点击监听器了......你只是抄袭编辑创造的所有信息。 点击这里阅读:https://grapesjs.com/docs/modules/Storage.html

阅读下方完整回答 ↓

问题

你好@artf,

我正在使用 grapesjs 的通讯插件和 ckeditor 插件。我在Canvas里拖拽了TEXT元素,用ckeditor做了一些编辑。我已经把它连接到了数据库。每次我把内容保存到数据库,重新安装编辑器后,我会从数据库字段设置内容值,然后把TEXT元素转换成BOX。 不知道为什么TEXT元素会变成BOX,而且CKEDITOR也无法加载到那个BOX元素里??请帮帮我。

![截图 2018-09-06 下午6:47 41](https://user-images.githubusercontent.com/13647531/45159639-f7b13800-b204-11e8-82b3-8231b43b0fb9.png)

回答(3)

artf2018年9月11日

@Siddharth-ss42279 如果你需要编辑用GrapesJS创建的模板,你不应该使用它的HTML......你应该导入它的 JSON......所以你做错了

就像做这个 “''js el.addEventListener('点击',...); someOtheEl.innerHTML = el.innerHTML;

然后抱怨为什么你的'El'没有点击监听器了......你只是抄袭编辑创造的所有信息。

点击这里阅读:https://grapesjs.com/docs/modules/Storage.html
artf2018年9月7日

你的数据库里存储什么?HTML和CSS呢?

Siddharth-ss422792018年9月7日

你好@artf 实际上,我用命令编辑器获得内行HTML。Commands.get('gjs-get-inline-html').run(editor)',并保存到数据库,渲染内容时我用的是 'editor.setComponent(content_field)' 问题是当我从数据库渲染内容时,TEXT 元素会被转换成 BOX 元素 (只有当我用ckeditor编辑该文本元素的部分文本时)而在BOX元素ckeditor中则没有加载。 以下任何一种方法都能解决我的问题:TEXT 元素不应被转换为 BOX或者,BOX 元素应加载 ckeditor 在Grapesjs通讯演示中复制该问题的步骤:后藤...

相关问答

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

问题 #1296

自定义富文本编辑器无法工作

你好@artf,我刚用不同的库(比如CKEditor 5、TinyMCE 4或pell)创建了一个RTE的自定义插件,但结果都是编辑器失去焦点,导致按钮无法应用到文本内容上。 ![截图 2018-07-18,17 06 53](https://user-images.githu...

3 个回答更新于 2020年2月18日

问题 #1754

Ckeditor 样式问题(4)

大家好,@artf们! 再次感谢你出色的工作! 我尝试用 grapesjs 实现 ckeditor,似乎基本正常工作,但今天我发现了一些奇怪的东西。我试着截图了,如果不清楚请告诉我......我选择白色文本,它会样式化跨度元素,一切正常。 ![ezgif com-video-t...

3 个回答更新于 2020年1月30日

问题 #1458

在 grapesjs 编辑器中嵌入了 Jquery 事件,但无法如预期工作。

@artf,我尝试把模板嵌入到grapesjs编辑器里。我遇到的问题是编辑器在那个模板下没有按预期工作。 注意:我用 react 应用来封装 grapesjs 编辑器。 最初编辑器嵌入了我的模板,看起来就像下面的图片 ![无题](https://user-images.gith...

3 个回答更新于 2019年10月9日

问题 #1793

:复制CKEditor工具栏

你好@artf, Grapejs 版本:0.14.52 步骤可再生:访问链接:https://grapedrop.com登录并访问模板网站。编辑一个模板。先拖放文本组件。继续拖拽文本组件下方的两列组件。点击并按住鼠标,将文本组件移动到两列内部。双击文本并观察工具栏。 意料之中:...

2 个回答更新于 2020年2月16日

与此问题匹配的付费插件

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

查看全部插件

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

免费方案

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

浏览免费插件 →
高级方案

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

浏览高级插件 →

相关教程

关于同一主题的深入指南。

全部教程 →

浏览插件分类

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