问题 #3713💬 已回答提出于 2021年8月18日作者 shkhalid1 个反应

Stored components with script can not be rendered properly

快速解答作者 shkhalid❤ 1

谢谢@artf！最后我终于弄明白了问题出在“tagVarStart”和“tagVarEnd”。评论完后它开始起作用了

问题

我在尝试保存一些组件（包括一些脚本）并重新加载页面时遇到了一些问题，组件渲染不正确。显示的是空盒子。举个例子：当我尝试从“jvas28/grapesjs-echarts”保存图表组件并重新加载页面时，会出现这种情况 <img width=“1438” alt=“截图 2021-08-18 下午4点20分” src=“https://user-images.githubusercontent.com/8138036/129891078-2191094d-d735-4178-9859-588f774120b6.png”> 这是示例应用 https://codesandbox.io/s/cranky-wescoff-93pxd?file=/src/App.js 我还尝试设置了远程[存储]（https://grapesjs.com/docs/modules/Storage.html）。但我还是得到同样的结果。这是API输出。 <img width=“1291” alt=“截图 2021-08-18 下午4：35：53” src=“https://user-images.githubusercontent.com/8138036/129891362-534bab14-f1c6-4c58-b061-a895df35921c.png”> 我觉得这和 https://github.com/ar...

回答（3）

shkhalid• 2021年9月28日

谢谢@artf！最后我终于弄明白了问题出在“tagVarStart”和“tagVarEnd”。评论完后它开始起作用了

return Grapesjs.init（{
   tagVarStart： '{{ '，
   tagVarEnd： ' }}'，
   .
   .
   });

artf• 2021年8月29日

@shkhalid谢谢你的报告，但在这个仓库里，你应该打开可重现的问题，不使用外部插件，因为问题可能出在插件本身。至少就我对核心的判断来看，如果按照这个[指南]（https://grapesjs.com/docs/modules/Components-js.html）正确实现，组件中没有问题。

GJSBlock• 2026年5月17日

谢谢你举报，@shkhalid。关于用脚本存储的组件无法正确渲染的好问题。推荐的组件方法是使用事件驱动的API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式： “JavaScript 留意变化 editor.on（'change'，（） => console.log（'something changed'））; 组件生命周期 editor.on（'component：mount'，（c） => console.log（'compon...

在 GitHub 上查看完整讨论 →