在编辑自定义组件内容时重置特性

Question

你好，

我有一个自定义组件，内容可以通过切换特性选择选项来更改，也可以像文本组件类型那样在画布内渲染时进行编辑。有没有简单的方法可以在编辑组件时重置与特质相关的属性？

“''js 型号：{ 默认值：{ 类型：“标签”，标签名称：“span”，可掉落：0，可编辑：1，可文本：1，特质：[{ 类型：“选择”，标签：“自定义类型”，名称：“customType”，选项：customTypeOptions， }], }, toHTML（） { return this.get（'content'）; },

浏览量：{ 事件：{ 焦点：“重置特性”， }, reseTrait（） { } }

inaLar · Accepted Answer

@artf，关于“选择”，我没能在同一个流程中连接内容变更并让它在特质变更时生效，也没能通过编辑文本/内容手动更改。手动更改后没能同步特性，但我设法让它正常工作了。自定义文本组件完全没问题。

至于上次发布的文档，我现在正在看，看起来非常好，但我发帖时还没看到。

可能只有我这样，但我通过榜样学习，所以更多的例子和用例总是加分项。

我知道产品是开放的，也很感谢你的努力。我希望自己能获得更多知识，并在不久的将来有所贡献。

干杯。

zgover · Answer

你可以在组件的内容道具上附加一个事件监听器，然后在回调中取该特征或更改特征的值道具，见下面的示例[摘自文档]（https://grapesjs.com/docs/modules/Traits.html#updating-traits-at-run-time） “JavaScript 让我们更新输入组件中定义的“类型”特征的“选项” const component = editor.getSelected（）; component.getTrait（'type'）.set（'options'， [ { id： 'opt1'， name： 'New option 1'}， { id： 'opt2'， name： 'New option 2'}， ]); 或具有多个值 component.getTrait（'type'）.set（{ 标签：“我的类型”， 选项：[...]， }); ```

inaLar · Answer

谢谢你，Zachary1748，但我不能用在我这边。也许我没解释清楚。 我有一个自定义组件。 组件内容可以通过三种方式更改：拖拽到画布中（你会弹出一个选项窗口）从设置中（也通过选项选择）在画布内编辑其文本 总之，我觉得我找到了一个解决方案——我创建了一个自定义数据类型，并将事件绑定到其更改上，而不仅仅是内容更改。但我还在测试。

在编辑自定义组件内容时重置特性

问题

回答（3）

相关问答

在 textNodes 中不能跳出 html 字符吗？

AddInput in domcomponent for html conditional it work work grapesjs 0.10.7 版本

渲染元素的拖拽占位符

更新属性变更的组件视图

与此问题匹配的付费插件

浏览插件分类