GrapesJS 的导出功能和“查看代码”功能，而 Canvas 在六进制颜色方面则不像其他方式。
感谢你举报，@akhalid-dev。 关于 GrapesJS 导出功能和“查看代码”功能，以及 Canvas 在十六进制颜色方面不一样的建议，真是太棒了。！虽然这个具体功能还没有出现在核心 API 中，但有几种方法可以实现类似的行为。 使用事件系统： “JavaScript editor.on（'component：update'， （component） => { 你的逻辑 }); ``` 替代方法： 听取“selector：add”以获取CSS选择器更改 使用“selector：custom”来表示自定义规则 利用“change：*”事件进行细致跟踪 构建一个插件，扩展编辑器并具备此功能 正式宣布： 如果此功能能惠及更多用户...
阅读下方完整回答 ↓问题
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Chrome v91 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞？直接访问网站：https://grapesjs.com/demo.html。清理画布以便进行更简单的演示。从“模块”部分插入文本元素。选择丢弃的文本元素，选择“样式管理器”，展开“排版”部分。粘贴十六进制值：“8ceb34”。这会在 GrapesJS 画布中将文字颜色更新为绿色。然而，当我们查看生成的CSS或导出为zip时，缺少的“#”符号将缺失，颜色也不会被应用。 ![图片]（https://user-images.githubusercontent.com/46307349/138298114-05f2be0e-794b-44fb-827f-93de4bb18fcd.png） 预期的行为是什么？ 要么，如果缺少“#”，画布中的颜色不应被更新，这会让用户误以为颜色被应用，或者“#”也应该添加到导出为压缩包或查看代码的功能中。 目前的行为是什么？ 目前的行为是颜色应用在 GrapesJS 画布中，给用户错误的误感，认为它有效，但导出或查看代码时，它并没有生成正确的 CSS。行为准则 [X] 我同意遵守本项目的行为准则
回答（1）
感谢你举报，@akhalid-dev。 关于 GrapesJS 导出功能和“查看代码”功能，以及 Canvas 在十六进制颜色方面不一样的建议，真是太棒了。！虽然这个具体功能还没有出现在核心 API 中，但有几种方法可以实现类似的行为。 使用事件系统： “JavaScript editor.on（'component：update'， （component） => { 你的逻辑 }); ``` 替代方法： 听取“selector：add”以获取CSS选择器更改 使用“selector：custom”来表示自定义规则 利用“change：*”事件进行细致跟踪 构建一个插件，扩展编辑器并具备此功...
相关问答
通过相似的问题讨论继续研究。
问题 #4082
从画布框中移除一些初始样式
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Chrome v96 可复制演示链接 没有演示 描述一下那个虫子 当我加载某个模板时，编辑器会添加一些初始样式，比如下面的图片，我该如何设置或移除某些样式？举个例子：我需要移除Webkit的滚动条...
问题 #4434
CSS 解析器的 shape 不允许 CSS 属性被定义超过一次。
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器？ 任何可复制演示链接 https://grapesjs.com/demo.html描述一下那个虫子 这个漏洞和“ParserCss.js”有关。 https://github.com/artf/grap...
问题 #4208
每个元素的样式点击状态错误
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Brave Last 在 Chrome Last 和 Safari Last 上测试过。 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这...
问题 #3564
无法刷新iframe
0.17.19 你能重现演示中的bug吗？ 是的 预期的行为是什么？ 我之前问过一个关于iframe刷新（#3413）的问题。[提案的解决方案]（https://github.com/artf/grapesjs/issues/3413#issuecomment-83189223...
与此问题匹配的付费插件
根据问题关键词和标签相关性精选，助你更快交付。
正在加载付费插件推荐……
相关教程
关于同一主题的深入指南。
教程
GrapesJS DevTools: A Developer Panel Inside Your Editor
If you've ever debugged GrapesJS with console.log(editor.getSelected()) and a dozen throwaway event listeners — this post is for you.
教程
How to Build a Production GrapesJS Editor: The Complete Walkthrough of Brief, Preset, Plugins, and Services
A complete walkthrough of building a production GrapesJS editor: how to choose a preset, pick plugins, and scope setup services without burning a sprint.
教程
Big Updates: TinyMCE 8 and Placeholder 2.0 for GrapesJS
In May we shipped major updates to two of our most popular GrapesJS plugins — TinyMCE Inline Text Editor and Placeholder.
浏览插件分类
直接跳转到市场上的插件分类页面。