问题 #1508💬 已回答提出于 2018年10月12日作者 ghost0 个反应

:在外部更改 gjs-html 后刷新 Canvas

快速解答作者 ghost

看来我忘了 DomComponents,下载并查看 grapesjs-newsletter 的 src 后,我在 openImportCommand 里发现 DomComponents 正在更新。所以我在更新本地存储的 HTML 后,在我的 react component WillReceiveProps 方法里添加了以下内容。 “编辑。DomComponents.getWrapper().set('content', ''); editor.setComponents($f(“body”).html();' 现在它能正确显示图片了,虽然还不完美,但我似乎已经走在正确的轨道上了。

阅读下方完整回答 ↓

问题

你好, 我一直在用GrapesJS配合ReactJS(GrapesJS位于自己的React组件中),但我在上传图片时遇到了问题,因为我自己在用React文件选择器组件时遇到了问题。 当我从文件选择器中的 react 组件选择图片时,因为它是 GrapesJS 外部的,我会手动更新本地存储中的 gjs-html 项,并通过 GrapesJS 组件中的 react 生命周期方法componentWillReceiveProps方法返回文件路径,效果很好,但我遇到的问题是,在修改 gjs-html 以更新 GrapesJS 画布后,无法触发更新,而我只能通过修改导入的图像显示在画布上,是要销毁 GrapesJS 实例并创建一个新的实例,使其在初始化时使用 gjs-html。 在返回选中的图片时,我已经超出了 GrapeJS 的权限,这也是我必须手动修改本地存储 gjs-html 的原因。我正在将 GrapesJS 的初始化分配到一个变量上,并希望通过它触发编辑器的刷新。很遗憾我没能更新画布来展示新图片。 我知道 GrapesJS 并不是专门为 React 设计的,但我想知道有没有办法刷新 Canvas,而不必销毁并重新初始化编辑器。我已经尝试过 API 并尝试了各种方法,但到目前为止还没找到解决方案。 我想知道你们有没有什么建议或方法可以推荐。 谢谢

回答(2)

ghost2018年10月16日

看来我忘了 DomComponents,下载并查看 grapesjs-newsletter 的 src 后,我在 openImportCommand 里发现 DomComponents 正在更新。所以我在更新本地存储的 HTML 后,在我的 react component WillReceiveProps 方法里添加了以下内容。 “编辑。DomComponents.getWrapper().set('content', ''); editor.setComponents($f(“body”).html();' 现在它能正确显示图片了,虽然还不完美,但我似乎已经走在正确的轨道上了。

cederron2022年5月1日

看来我忘了 DomComponents,下载并查看 grapesjs-newsletter 的 src 后,我在 openImportCommand 里发现 DomComponents 正在更新。所以我在更新本地存储的 HTML 后,在我的 react component WillReceiveProps 方法里添加了以下内容。“编辑。DomComponents.getWrapper().set('content', '');editor.setComponents($f('body').html()';现在图片显示正确了,虽然还不完美,但我似乎已经走在正确的路上了。 嘿,这让我找到了正确的...

相关问答

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

问题 #3337

问题:使用方向键在Canvas中以绝对定位模式移动方块

你好,我正在为学生开发一个解决方案,让学生通过Grapejs编辑器(类似Canva)制作幻灯片讲述他们的高中经历,并且已经将编辑器配置为“绝对”模式,效果非常好。 但我似乎找不到用方向键在编辑器里移动掉落方块的方法。 我知道自定义键位绑定,会考虑添加这个功能,但只是想看看我是不...

4 个回答更新于 2024年8月15日

问题 #5746

当面板不在编辑器容器时,ColorPicker 偏移不正确

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome v122 可复制演示链接 https://grapesjs.com/docs/getting-started.html#style-manager 描述一下那个虫子 如何复现这个漏洞...

4 个回答更新于 2024年3月14日

问题 #4621

没有找到在单一画布上显示多页的选项

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 无链接 描述一下那个虫子 你好, 我用的是 Grapsjs 和 React,到目前为止觉得非常有用,但我想把应用中创建的所有页面展示出来,以便在 Canvas 上预览,却找不到...

4 个回答更新于 2024年1月30日

问题 #5083

方块不能拖到画布上

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 陶瑞 可复制演示链接 描述一下那个虫子 如何复现这个漏洞?... 预期的行为是什么? ... 目前的行为是什么?** ... 如果需要执行某些代码以重现该漏洞,请将其粘贴到下面: “''js “使...

4 个回答更新于 2023年5月2日

与此问题匹配的付费插件

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

查看全部插件

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

免费方案

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

浏览免费插件 →
高级方案

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

浏览高级插件 →

浏览插件分类

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