特质的变更不会更新 HTML

Question

葡萄JS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ 铬 可复制演示链接 https://jsfiddle.net/weellingtonc/t8hs9f67/2/ 描述一下那个虫子 如何复现这个漏洞？在工作区中添加“按钮立方体”组件点击已创建按钮进入设置组件，更改“texto do botao”属性的值打开查看生成HTML的选项 预期的行为是什么？ 更新特性时，它还会生成一个新的 HTML 目前的行为是什么？ 它保留了按钮的初始状态，保留了旧文本 注意：保存时也会发生这种情况，如果你在更改文本前后点击保存（软盘），你会注意到按钮的文本值没有变化！行为准则 [X] 我同意遵守本项目的行为准则

skru · Accepted Answer

首先，你的代码需要放进一个插件 [https://grapesjs.com/docs/modules/Components.html#define-custom-component-type]（https://grapesjs.com/docs/modules/Components.html#define-custom-component-type）

而且你不是在更新组件的模型，只是在Canvas里更新html......

https://jsfiddle.net/jmweg8u1/4/

artf · Answer

是的，没错，谢谢@skru 你也可以直接将“内容”与特征连接，读取初始值。 “''js 特征：[{ 标签：'Texto do botão'，类型：'text'，名称：'content'，changeProp： true }]， ```

ClaudeCode · Answer

谢谢你举报，@capoia。 关于性状变化不会更新html的好问题。推荐的组件方法是使用事件驱动的API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something changed'））; 组件生命周期 editor.on（'component：mount'， （c） => console.log（'component ready'， c））; editor.on（'component：update'， （c） => console.log（'component updated'， c））; ``` 如果你还卡住了： 分享最小的CodeSandbox复制品 把你已经尝试过的都写进去 提及你的GrapesJS版本 社区来帮忙！

特质的变更不会更新 HTML

问题

葡萄JS版本

你用的是什么浏览器？

可复制演示链接

描述一下那个虫子

行为准则

回答（3）

相关问答

Set root 不起作用

组件在更新性状时重置属性值（仅首次）

Editor.getSelected（）.toHTML（）编码内联 JavaScript

符号样式未同步

与此问题匹配的付费插件

相关教程

GrapesJS DevTools: A Developer Panel Inside Your Editor

How to Build a Production GrapesJS Editor: The Complete Walkthrough of Brief, Preset, Plugins, and Services

Big Updates: TinyMCE 8 and Placeholder 2.0 for GrapesJS

浏览插件分类

问题