#53302023年8月24日作者 rozek3 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 没有 可复制演示链接 没有 描述一下那个虫子 “纱线构建”失败,出现两个错误: 这可能只是TypeScript太挑剔的问题,因为你可以用“// @ts-ignore”禁用错误信息,然后重新编译测试会顺利运行。 但因为我刚接触GrapesJS,不能自评。无论如何,通常不建议直接用“// @ts-忽略”来处理TypeScript错误...... 行为准则 [X] 我同意遵守本项目的行为准则
ClaudeCode
谢谢你举报,@rozek。 最新版本(提交4f0c5b1)不再无错误编译的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这有助于团队更快识别根...
#53282023年8月22日作者 sdimitrenco2 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 https://jsfiddle.net/sdimitrenco/wao1rh0q/30/ 描述一下那个虫子 那是我的组件结构 如果我在文本编辑器中更改span标签中的文本,然后移除该词的焦点,它会返回文本的前一个状态。组件的结构看起来正常,是链接,但内容在图片和文字中,都放在span标签里。 演示  现场演出 https://jsfiddl...
ClaudeCode
谢谢你举报,@sdimitrenco。 移除RTE焦点后可编辑文本的问题,返回了之前的内容状态。似乎是竞赛条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这有...
#53202023年8月18日作者 SwapnilSoni19994 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome v114 可复制演示链接 没有 描述一下那个虫子 如何复现这个漏洞?我用的是[grapesjs-react](https://www.npmjs.com/package/grapesjs-react),用的是'assetManager'我的配置长这样 “''js { 上传: '${globals.settings.cmsUrl}/upload-image', 上传名:“image”, 页头:{ 授权:“持有人${token}', }, autoAdd: true, multiUpload: false, } ``` 附言:我确实有一个能...
artf
刚试了同样的配置,一切正常。 可能和你的Grapesjs版本或者“grapesjs-react”本身有关。 如果你无法用最新版本的GrapesJS提供可复现的演示,请避免制造BUG问题。 我也强烈建议切换到[官方的GrapesJS React包装器](https://github.com/GrapesJS/react),它也允许你为编辑器实现完全声明式的自定义UI。
#53122023年8月17日作者 srinivas9772 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器? Chrome V115可复制演示链接 https://jsfiddle.net/srinivas977/ahgLxv6e/10/描述一下那个虫子 如何复现这个漏洞?在提供的JSFiddle中,包含一对文本行和选择列表。接着,添加一个子列表,然后添加子列表。之后,点击选定元素外的选项会使子列表中的某个物品消失。 这个现象也在这个视频链接中看到(从视频第30秒开始注意): https://github.com/GrapesJS/grapesjs/assets/49796104/59de9aa5-5f3f-43ae-9ed1-358b86ac8b27 预期的行...
artf
不幸的是,由于默认实现依赖于 [deprecated execCommand](https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand),导致太多边缘情况难以处理,已经不值得再花时间去处理了。 我建议只用它来处理基本格式(例如加粗、斜体、下划线等),对于更复杂的元素,我强烈建议创建[自定义组件](https://grapesjs.com/docs/modules/Components.htm...
ClaudeCode
谢谢你举报,@srinivas977。 关于列表富文本编辑器缩进操作的问题的好建议!虽然这个具体功能还没有出现在核心 API 中,但有几种方法可以实现类似的行为。 使用事件系统: “JavaScript editor.on('component:update', (component) => { 你的逻辑 }); ``` 替代方法: 听取“selector:add”以获取CSS选择器更改 使用“selector:custom”来表示自定义规则 利用“change:*”事件进...
#53052023年8月13日作者 rajevar2 个回答
葡萄JS版本 0.21.4[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器? Chrome 版本 113.0.5672.63可复制演示链接 https://jsfiddle.net/szLp8h4n/11/描述一下那个虫子 如何复现这个漏洞? 在页面上移动任何文本组件。 警报将会显示。 可能是倒退。 https://github.com/GrapesJS/grapesjs/issues/868 没看到重新开启bug的选项,所以新建一个。 预期的行为是什么? 警报只会在向画布添加新组件时显示 目前的行为是什么? 如果需要执行某些代码以重现该漏洞,请将其粘贴到下面: “''js 你的代码在这里 ```行为准则[X] 我同...
artf
你好@rajevar我觉得你是在找“component:create”事件,因为“component:add”是正常工作的(比如用来跟踪某个组件内的任何新移动)
ClaudeCode
谢谢你举报,@rajevar。 关于“组件:添加”事件在组件移动时触发,这个问题很棒。推荐的 Canvas 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('something ch...
#52882023年8月9日作者 pittleCheung2 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 最新版本的Chrome浏览器 可复制演示链接 无效 描述一下那个虫子 如何复现这个漏洞?Tup-Node SRC/index.ts --format esm,cjs --legacy-output --watch 预期的行为是什么? 我用vite来做葡萄 目前的行为是什么?<img width=“1126” alt=“image” src=“https://github.com/GrapesJS/grapesjs/assets/114127651/26e08b79-17e9-42ca-9133-dae9a32313d4”><img width=“65...
artf
我觉得你得向 Vite 社区反映这个问题,核心现在用的是 webpack,运行正常
ClaudeCode
谢谢你举报,@pittleCheung。 关于use tsup-node build grapesjs appear Uncaught Error:不支持“codemirror/lib/codemirror”的动态要求,非常好的问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现...
#52862023年8月8日作者 saharhagekr2 个回答
在较小的笔记本屏幕(比如MacBook)上,图片的边框和某些元素的位置不对(当我点击移动或调整图片大小时) 当编辑器在大屏幕上渲染时,我就没有这个问题了。 我不确定是不是我漏掉了什么配置步骤。 有人能帮帮忙吗?这是常见问题吗? 例如: <img width=“217” alt=“截图 2023-08-08 下午3点20分19分” src=“https://github.com/GrapesJS/grapesjs/assets/121887023/9b83c4a2-c944-4faf-94e0-3d6bca9c80d1”> <img width=“245” alt=“截图 2023-08-08 下午3:20 25” src=“htt...
artf
@saharelhage请避免将讨论转化为议题。GitHub 问题应仅通过正确遵循模板从[这里](https://github.com/GrapesJS/grapesjs/issues/new/choose)创建。
ClaudeCode
谢谢你举报,@saharhagekr。 关于图像边界和某些元素位置错误的好问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('something chang...
#52692023年8月2日作者 sannila1 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器? Chrome 115.0可复制演示链接 https://jsfiddle.net/varyqjo7/描述一下那个虫子 如何复现这个漏洞?创建一个新的 Angular 项目(版本 16.1.3)Install grapesjs 最新版本 (npm i grapesjs)在angular.json(脚本和样式)中添加css和js添加面板 预期的行为是什么? el 应该接受面板中的对象。 目前的行为是什么? el 不接受面板的对象 请见下方附件:  寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('cha...
#52632023年7月28日作者 pittleCheung4 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 最新版本的Chrome浏览器 可复制演示链接 无效 描述一下那个虫子 如何复现这个漏洞? <img width=“1666” alt=“image” src=“https://github.com/GrapesJS/grapesjs/assets/114127651/c37e339a-e14f-486b-85fb-34c170b855dd”> 预期的行为是什么? 目前的行为是什么? 我用的是 rewrite ctrl + c 和 ctrl + v 的逻辑 <img width=“681” alt=“image” src=“https://github...
pittleCheung
是的,你说得对,我复制了所有匹配的样式,这样我可以粘贴到任何地方,甚至跨浏览器粘贴,我觉得这非常有用。当我删除组件时,对应的样式不会被移除。这是一个大问题,当我在同一个网站上多次复制粘贴时,会导致大量重复的样式,容易引发样式冲突。 所以我不能指望那些风格被简单删除。如果可能的话,我会很感激一些建议。 “如果你复制了所有匹配的样式,它还会包含其他元素使用的样式,所以你不能指望那些样式被简单删除。”
artf
我不明白这怎么会是核心漏洞。 你用的是自己的复制粘贴逻辑,感觉也不对,你应该注意每个组件/规则的唯一ID。删除这些子组件后,它们的样式依然保留。 如果你复制了所有匹配的样式,它还会包含其他元素使用的样式,所以不能指望那些样式被简单删除。 请,如果你提交了bug,务必提供可复现的演示。
#52492023年7月24日作者 pittleCheung3 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 最新版本的Chrome浏览器 可复制演示链接 无效 描述一下那个虫子 如何复现这个漏洞? 编辑?Css.addRules(targetCss); 预期的行为是什么? 编辑?Css.addRules(targetCss); 它为结尾增添了风格 <img width=“826” alt=“image” src=“https://github.com/GrapesJS/grapesjs/assets/114127651/28425b0a-b9f7-46a8-b8bc-736aa112cc3c”> 目前的行为是什么? 我帮忙编辑吗?Css.addRules(...
artf
这不是个bug,'Css.addRules'没有任何选项参数。 你可以就这个话题展开讨论,我们可以看看是否有必要引入它
pittleCheung
好的,我明白了,我需要在数组前面添加样式,而不是在最后。比如 arr.unshift(css)。我该怎么做?我可能需要你帮帮我
ClaudeCode
谢谢你举报,@pittleCheung。 关于编辑?的好问题。Css.addRules(targetCss);.推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => consol...