#45722022年9月9日作者 stljeff14 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ 镀铬 可复制演示链接 https://jsfiddle.net/1hza4t9n/ 描述一下那个虫子 如何复现这个漏洞？初葡萄创建事件处理程序，用于页面更新时使用。更新页面观察事件处理程序未触发 预期的行为是什么？ 页面事件处理程序：更新触发 目前的行为是什么？ 没什么 如果需要执行某些代码以重现该漏洞，请将其粘贴到下面： “''js const editor = Grapesjs.init（{ 容器：“#gjs”， fromElement： 0， pageManager： { 页码：[ { 编号：“索引”， 风格：'身体 { 颜色：红色; }'，...
artf
更新页面 你是如何更新页面的？ 值得一提的是，“page：*”事件只针对页面模型触发，而不是页面内容，比如： “''js 编辑。Pages.getSelected（）.setName（'我的页面'）; ```
stljeff1
任何更新、拖动方块、更改文字颜色。文本内容的变更。在 JS Fiddle 里，我拖动文本块，更改内容，换颜色。我更新时没有看到触发事件，所以我开始质疑自己的期望 我正在尝试了解如何构建自定义存储管理器。我用Grapes已经很久了，Grapes和我的服务器/数据库之间有很多“中间件”。我正在升级Grapes，所以想了解最合适的事件来跟踪所做的更改。 最终，我正在更多地了解店长，我有信心这会带我达到目标。 不过，我想了解页面管理器......我得好好考虑你说的页面模型。
artf
好吧，'page：update' 事件不是你需要的，因为它不会在内容更改时触发（所以我决定关闭这个问题，因为事件正常工作）。 你能解释一下你想构建哪种自定义存储管理器吗？存储管理器本身在内容更改时已经会触发，所以我不明白你为什么要重建这个功能。
#45292022年8月24日作者 FaisalShaikhHA4 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器？ 版本 104.0.5112.101（官方构建）（arm64）视频演示链接 https://d.pr/i/27EgH2描述一下那个虫子当我们调整带有“xyz”类的图片大小时，页面上所有同类元素也会被调整大小，因为编辑器会为这些类添加高度、宽度、CSS。但当我从图片中移除所有类时，编辑器会用 ID 来设置 CSS 的高度宽度。我正在编辑器中加载一个引导模板。 录音链接：https://d.pr/i/27EgH2 繁殖步骤：加载引导模板进行编辑。添加多个带有影子类的 div ex.（''<'div 类=''shadow'></div>'''）将一张图像放入带有...
DevMetwaly
https://grapesjs.com/docs/modules/Components.html#components-css组件优先的样式 默认情况下，当你在画布中选择组件并应用样式时，会对其现有的类进行更改。这会导致所有应用类别的组件发生变化。如果你只想对特定选定组件应用样式，就必须通过这种方式选择 componentFirst 策略。
FaisalShaikhHA
谢谢，@DevMetwaly有效，抱歉我错过了。
FaisalShaikhHA
你好，@artf，首先，这个框架非常棒，感谢你让它开源。 正如上面评论里描述的，我遇到了这个奇怪的问题，如果我做错了什么或者有解决办法，请告诉我，谢谢。
#45122022年8月15日作者 mingodad3 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ 版本 103.0.5060.134（官方构建）基于 Ubuntu，运行于 Ubuntu 18.04（64 位） 可复制演示链接 https://alvarotrigo.com/blog/html-css-tabs/ 描述一下那个虫子 测试上述示例时没有切换或显示标签页内容 https://alvarotrigo.com/blog/html-css-tabs/ 比如这个“4”。“动画HTML和CSS标签页”准备导入，下面显示： 行为准则 [X] 我同意遵守本项目的行为准则
mingodad
我查了一下，发现了一个已关闭的问题 https://github.com/artf/grapesjs/issues/2873 基于它，我这样做允许预览模式下勾选/无线电： 现在至少在预览中复选/无线电能用，一些演示也能在“预览”中运行。 如果这些信息能包含在文档里就太好了！
artf
感谢@mingodad我发布了表单插件的新[版本]（https://github.com/artf/grapesjs-plugin-forms/releases/tag/v2.0.5），并增加了对预览的支持。
ClaudeCode
谢谢你举报，@mingodad。 本页几乎所有示例都与葡萄音相符失败的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。 尝试什么： 添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤：** 如果还没测试过，请用最新的GrapesJS版本测试 提供最小可重复的示例（CodeSandbox）——这有助于团队更快识别根...
#45032022年8月5日作者 gustavohleal4 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ 铬 v96 可复制演示链接 https://grapesjs.com/demo-newsletter-editor.html 描述一下那个虫子 如何复现这个漏洞？在控制台标签页打开开发者工具运行下面的代码选择新增的文本用CKEditor编辑内容选择另一个组件 预期的行为是什么？ 预计会从文本组件内的跨度添加内联样式，这样CKEdittor就能理解文本样式，并在打开时保留这些样式。 目前的行为是什么？ 通过“editor.addComponent（）”添加原始HTML确实会添加样式，但一旦你编辑文本并模糊，样式就会从它们应有的文本段中移除。这只发生在C...
pety-dc
嘿 我也遇到过类似的问题。我认为情况相当严重，因为通讯和 mjml 演示版都受到了影响。（两者都使用 CKeditor 作为 RTE） 当我导入包含带有样式元素（span）的文本（mj-text）的内容时，导入的内容会被解析，样式元素被识别为独立组件，而不是作为换装文本元素的内容。 示例（根据 mjml.io 有效）： 预期结果： ![图片]（https://user-images.githubusercontent.com/25766885/230409523-b8b57...
raymondmakz
CKeditor 输出： '<div><span style=“color：blue”>ckeditor 中的部分富文本</span></div>” 解析到编辑器后，可以变成： '<div data-gjs-type=“text”>来自 <span 的一些富文本 style=“color：blue” data-gjs-type=“default”>ckeditor</span></div>' 基本上每个主导者都变成了组成部分。 也许可以让开发者选择是否停止添加子节点作为组件...
#44962022年8月3日作者 bovealexandre4 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器？ Chrome 最新版本可复制演示链接 没有，因为它有太多React等自定义代码描述一下那个虫子 如何复现这个漏洞？ 用 setStyles 向编辑器添加更多样式 这是我在 setStyles 里用过的字符串 “''CSS .test { 显示：方块; } .test .hide { 显示：无; } .btn { 背景：白人; } 新鲜 { 背景：白人; } .fresh .fresh-2 { 边框：1px 红色实心; } 如果需要执行某些代码以重现该漏洞，请将其粘贴到下面： 无需代码测试，只需 edit API 中的 setStyle 即可行为准则[X]...
bovealexandre
当我试图添加这个时 它只是增加了这一点
artf
@bovealexandre至少提供一个简易可复现的例子，因为从我目前看到的情况来看，可能是你的自定义代码导致的
bovealexandre
@bovealexandre至少提供一个最小可复现的例子，因为据我目前看到，可能是你的自定义代码导致的 好的，我刚刚在我的scss编辑器上做了editor.getCss（{ keepUnusedStyles： true }
#44742022年7月22日作者 bimsina3 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器？ Chrome 103.0.5060.134可复制演示链接 https://stackblitz.com/edit/node-zrdtg4?file=index.js描述一下那个虫子 如何复现这个漏洞？在无头模式下初始化编辑器仅用一个基础文本节点加载项目数据 <details> <summary>点击展开查看样本数据。</summary> “JavaScript cont justTextData = { 资产：[]， 风格：[]， 页码：[ { 帧数：[ { 组件：{ 类型：“包装”， 可造型：[ “背景”， “背景色”， “背景图像”， “背景重复”，...
artf
这里已修正 https://github.com/artf/grapesjs/commit/f61222ec904ed56794f7b97e362ea2006dfceaf6
ClaudeCode
谢谢你举报，@bimsina。 关于无头模式运行需要窗口的好问题。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something change...
#44552022年7月18日作者 mickeyDominic3 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Chrome 版本 103.0.5060.114 可复制演示链接 https://codepen.io/Dominic_M/pen/eYMgqyw 描述一下那个虫子 如何复现这个漏洞？关注GrapesJS“入门指南”>> https://grapesjs.com/docs/getting-started.html继续做教程直到“响应式模板（https://grapesjs.com/docs/getting-started.html#responsive-templates）”，你会发现添加移动端和桌面视图切换面板后，一个面板会取代另一个。 预期的行为...
artf
@mickeyDominic你把所有默认面板放在同一个物体下面 “''js 面板：{ 默认值：[{ id：“层次”， EL：“.panelright”， // ... 编号：“面板调车员”， EL：“.panelswitcher” }] }
mickeyDominic
谢谢你@artf。 真是太傻了:)
ClaudeCode
谢谢你举报，@mickeyDominic。 关于'面板设备'和'面板-切换器'冲突的好问题。ProseMirror 推荐的方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'somet...
#44482022年7月14日作者 ronaldohoch4 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ 勇敢浏览器 最后版本 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞？打开演示页面。放置图像。双击选择图片。将宽度设置为100%。将高度设置为自动，或点击高度属性中的“x”。调整图片大小，你会发现宽度保持百分比，高度以像素计算点击预览眼确保图像被压平。 预期的行为是什么？ 缩放算法应该用像素计算，而不是混合 目前的行为是什么？ Resize函数保持%作为主CSS Unity，并用像素计算高度，但当我们点击预览按钮时，列的大小会变化，比如宽度（钢材加工百分比）变了，但高度（像素单位）是坏...
artf
嗨，Ronaldo，我不确定是否有简单的方法能在所有用例中全局修复这种行为，因为你是为两个尺寸调整图像大小，而不仅仅是宽度（那样高度不会改变）。 我建议你可以尝试用这个“可调整大小”选项扩展图像组件 “''js 可调节大小：{ ratioDefault： true， keepAutoHeight： true } ``` 如果这样对你有用，告诉我
gustavohleal
你好，@artf。我们想通过根据用户的使用场景，将宽度和高度的单位始终合并。这意味着当用户将宽度从像素改为百分比时，例如高度也会被改为百分比。有没有办法做到这一点？ 另外，我们怎么把调整尺寸改成用%作为默认单位？
ronaldohoch
如果这样对你有用，告诉我 你好，Arthur，这些配置没有改变图片，它总是用“px”而不是“auto”来设置高度，正如属性“keepAutoHeight”所暗示的那样
#44472022年7月13日作者 barryross3 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ 103.0.5060.114 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞？点击父容器，比如演示中第一个带有“.container-width”类的组件在排版中，选择如绿色等颜色点击一个明显继承了绿色的子元素在样式管理器中展开排版面板 预期的行为是什么？ 我认为我们希望颜色选择器显示所选子元素继承/计算出来的绿色值 目前的行为是什么？ 目前显示的是白色 如果需要执行某些代码以重现该漏洞，请将其粘贴到下面： “''js 你的代码在这里 ```行为准则 [X] 我同意遵守本项目的行为准则
artf
你好，Barry，是的，目前这是预期行为（也请查看这个[讨论]（https://github.com/artf/grapesjs/discussions/4245）），但我希望有一天能为继承财产提供适当的支持。
barryross
好的，谢谢你告诉我 2022年7月18日星期一上午9：29，Artur Arseniev @.> 写道： 你好，Barry，是的，目前这是预期的行为（也请查看这个） 讨论<https://github.com/artf/grapesjs/discussions/4245>）但我 希望有一天能为继承财产提供适当的支持。 — 直接回复此邮件，请访问GitHub查看 <https://github.com/artf/grapesjs/issues/4447#issuecommen...
ClaudeCode
谢谢你举报，@barryross。 关于样式管理器不能准确反映继承颜色的好问题。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something...
#44352022年7月10日作者 bovealexandre4 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器？ Chrome 最新版本可复制演示链接 暂时没有描述一下那个虫子 如何复现这个漏洞？创建包含Pages API函数的页面管理器测试select函数（如果你脑子里有东西，它会消失;如果你重新添加那个代码，它不会生效）测试加法函数 你只能运行一次 预期的行为是什么？ 选择不要破坏画布上的一切 添加以增加多页 目前的行为是什么？ Select会破坏设备管理器，无法运行重新添加的代码 添加，即使多次呼叫，也只能跑一次 如果需要执行某些代码以重现该漏洞，请将其粘贴到下面： 选择函数 “''js const selectedPage = 编辑者。Pages.get（p...
bovealexandre
加法函数已经修复了，虽然我发送的数据有错误，但我仍然不明白为什么Tailwind的CSS不适用，尽管它在头部标签里
artf
你用的是“config.canvas.styles”这个选项吗？ https://github.com/artf/grapesjs/blob/b657428b3efc343513f6c92eb6b418935d2a8ac9/src/canvas/config/config.js#L14-L22 你能创建一个可重复的用例演示吗？
bovealexandre
你好@artf很遗憾，我无法在CodePen或JSFiddle上创建可复现的演示，因为里面内容太多，而且我用的是nextJS等技术，但如果你需要，我可以给你访问仓库的权限，那是个私有仓库。 我用的是 Grapesjs-Tailwind，他会把它附加到标题，但当我尝试同样做时，换页时帧完全崩溃。