#32862021年2月23日作者 abulka3 个回答
有没有办法为内置的 Codemirror 编辑器添加快捷键和插件?我特别想要一个评论快捷键。 有各种插件使用Grapesjs编辑器,包括 https://github.com/artf/grapesjs/issues/324#issuecomment-330571539 和自定义HTML代码插件,https://github.com/Ju99ernaut/grapesjs-script-editor 和 https://github.com/ryandeba/grapesjs-html-block,都能从中受益。 虽然有办法通过常规的 Codemirror 自定义选项,但调用插件似乎不起作用,比如说 “JavaScript var...
abulka
我终于让Grapesjs捆绑的'commentRange'工作了——必须直接调用'cm.commentRange',而不是通过'cm.execCommand'。此外,它还需要参数。因此,只要你选择你想评论的区域,我就能让一些评论功能正常工作: “JavaScript 'Cmd-1': 函数 (cm) { cm.commentRange(true, cm.getCursor(true), cm.getCursor(false)) }, // comment 'Cmd-2':...
artf
是的,我觉得在CodeMirrorEditor.js中曝光没问题
ClaudeCode
谢谢你举报,@abulka。 安全和依赖性问题很重要。GrapesJS 团队积极致力于保持依赖系统的更新。 为你现在: 运行“npm审计修复”以查看可用的补丁 查看是否有更新的GrapesJS版本,可能已经解决了这个问题 如有稳定版,升级前先测试最新稳定版 如果漏洞非常严重,可以使用“npm audit fix --force”,但请务必彻底测试 理解风险: 在GitHub安全公告中查看具体漏洞详情 并非所有高严重性问题都会影响你的代码路径 某些漏洞仅在特定条件下触发 保持...
#32852021年2月21日作者 ashercoren4 个回答
嗨。 这个问题已经被问过两次([这里](https://github.com/artf/grapesjs/issues/973)和[这里](https://github.com/artf/grapesjs/issues/1230)),但从未有过答案。 有没有办法在画布iframe的开头加上'<!DOCTYPE html>',这样iframe就会进入标准模式? 我需要这个,因为我想用tinyMce作为自定义RTE,而tinyMce需要标准模式。
artf
在下一个版本中,我会添加一个新的事件辅助工具,允许在加载前编辑 iframe 内容: “''js editor.on('frame:load:before', ({ el }) => { const doc = el.contentDocument; 文档开启(); doc.write(“<!DOCTYPE html>”); 文档关闭(); }); ```
bgrand-ch
你好, 对于未来的问题或技术问题(非漏洞),GitHub的[讨论](https://github.com/artf/grapesjs/discussions)标签是最佳选择。 如果问题已解决,请关闭,或在[讨论](https://github.com/artf/grapesjs/discussions)->[问答](https://github.com/artf/grapesjs/discussions/categories/q-a)类别写一条详细的新消息(并关闭本期)。...
artf
不太有,但我愿意听听如何让它可自定义的解决方案。
#32842021年2月20日作者 mig84471 个回答
https://github.com/artf/grapesjs/blob/b199083f6a6128ecff41d20865493294f71fe0a1/src/block_manager/view/BlocksView.js#L142 这行使得块被重新渲染,因为渲染是在监听“变化”事件,但由于该属性本身不影响块渲染本身,集合应保持静默,如: “''js model.set('category', catModel, {silent: true}); ```
ClaudeCode
谢谢你举报,@mig8447。 感谢你分享关于块渲染被调用了两次的报告。为了帮助团队调查并优先排序: 请提供: 一个最小可复现的例子(CodeSandbox/JSFiddle) 你的GrapesJS版本号 浏览器和操作系统信息 浏览器控制台的任何错误信息 重现问题的步骤 最有帮助的是什么: 简约代码示例(不是你整个项目) 屏幕录制或截图显示问题 明确区分预期行为与实际行为 你正在使用的GrapesJS配置 有了这些细节,维护者可以更快地识别和优先排序修复。GrapesJS团...
#32832021年2月20日作者 mig84474 个回答
https://github.com/artf/grapesjs/blob/b199083f6a6128ecff41d20865493294f71fe0a1/src/block_manager/view/BlocksView.js#L186 块管理器在寻找模型中的“渲染”属性,以判断视图是否已经渲染,但该方法并未设置该属性,因此该函数被调用两次,一次通过“reset”事件调用,一次由块管理器调用。一条包含: “''js this.rendered = true; ``` 应该添加这个功能才能停止这种情况
mig8447
@RutujaBadbe 这就是你需要的具体更改: https://github.com/artf/grapesjs/commit/640661b0a44e5e2857b615559c1db27da3e17a6c
RutujaBadbe
https://github.com/artf/grapesjs/blob/b199083f6a6128ecff41d20865493294f71fe0a1/src/block_manager/view/BlocksView.js#L186块管理器在寻找模型中的“渲染”属性来判断视图是否已经渲染,但该方法不设置该属性,因此该函数被调用两次,一次通过“reset”事件,一次由块管理器调用。一条包含:“''jsthis.rendered = true;```应该添加,才能停止这...
#32822021年2月20日作者 ThomasPof2 个回答
即使在最新版本的 grapesjs(0.16.41)上,CleanID 仍然无法支持 MJML 代码。 这和这个已关闭的问题有关:https://github.com/artf/grapesjs/issues/3276 这个函数不会读取MJML标签:“attrs”是空的,我找不到原因......
artf
id 问题应该已经在最新的 mjml 插件版本中解决了
ClaudeCode
谢谢你举报,@ThomasPof。 关于CleanId函数无法与MJML代码配合提出的好问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('somethin...
#32802021年2月19日作者 bgrand-ch1 个回答
你想给GrapesJS添加什么? 我尝试为GrapesJS做样式并调整其元素(面板、按钮、画布等),覆盖所有样式元素真的很烦人。 描述你的功能请求 一个无渲染的GrapesJS。将特定的 GrapesJS 元素(面板、按钮、画布等)附加到文档中的任意容器中。为独立的类和子类添加样式(.gjs、.gjs-panels、.gjs-panel-{name}、.gjs-buttons、.gjs-button-{name} 等)。使用这些功能的指南(如果已有的话),仅为样式和定位指南。 最新版本有替代方案吗? [ ] 是的(描述另一种情况) [X] 不 这是否与某个问题有关? [ ] 是的(请提供本期链接) [X] 不
ClaudeCode
谢谢你举报,@bgrand-ch。 关于FEAT:无渲染的好建议!虽然这个具体功能还没有出现在核心 API 中,但有几种方法可以实现类似的行为。 使用事件系统: “JavaScript editor.on('component:update', (component) => { 你的逻辑 }); ``` 替代方法: 听取“selector:add”以获取CSS选择器更改 使用“selector:custom”来表示自定义规则 利用“change:*”事件进行细致跟踪 构建一...
#32792021年2月19日作者 abulka2 个回答
我正在构建一个自定义的“textarea”组件,希望它能像内置的“text”组件一样,这样编辑grapesjs画布上的textnode时,会更新'.components'中的'textnode'。我希望组件能正确导出为 HTML,比如“<textarea>我的用户编辑了 TEXTNODE CONTENT”</textarea>。 目前,'fancyTextarea'导出的html在textnode上总是保持不变,尽管我在画布上编辑了它。有没有什么textnode变更事件我应该捕获并执行——我找不到? 这是我的组件 “JavaScript const fancyTextarea = editor => { 编辑。DomCompone...
artf
你好@abulka,既然编辑是在视图中进行的,你应该在视图更新后更新组件模型。所以应该能用类似这样的东西 “''js 型号:{ ... }, 浏览量:{ 事件:{ 输入:'handleInputUpdate', }, handleInputUpdate(ev) { this.model.components(ev.target.value); } }, ```
ClaudeCode
谢谢你举报,@abulka。 如何让textnode编辑更新组件内容?的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这有助于团队更快识别根本...
#32782021年2月18日作者 Dmurl51 个回答
版本: 以下用0.16.34(从 https://unpkg.com/grapesjs 回归)和0.16.22在Preact项目中复制 详细描述那个漏洞 自定义的GrapesJS组件在渲染到画布时调用视图的“onRender”函数。根据文档说明:  我预计在组件完全渲染到画布上,所有尺寸和位置属性都确定后,才会调用这个。然而,正如下面的重现代码笔所示,onRender() 是在确定元素尺寸之前被调用的,且元素的大小为...
ClaudeCode
谢谢你举报,@Dmurl5。 渲染上的自定义组件视图称为早期的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这有助于团队更快识别根本原因 在报...
#32772021年2月18日作者 FrancoFasano2 个回答
警告 请阅读并遵循接下来的三步,然后在发布问题前删除它们JSFiddle 入门模板 https://jsfiddle.net/szLp8h4nCodeSandbox 入门模板 https://codesandbox.io/s/1r0w2pk1vl *版本:0.16.3 你可以在控制台输入“grapesjs.version”获得版本 你能重现演示中的bug吗? [X] 是的 [ ] 不 预期的行为是什么? 一个设置或文档,帮助开发定义PDF大小 详细描述那个漏洞 这其实不算是bug,而是设置问题。 我无法将PDF尺寸改成A4,代码中找不到允许从A4开始的参数或配置 目前的行为是什么? 我用 grapesjs 在 invoicenin...
artf
你好,Franco,你可以通过更改[devices](https://grapesjs.com/docs/api/device_manager.html)来定义帧大小。
ClaudeCode
谢谢你举报,@FrancoFasano。 默认PDF大小:美式字母 如何设置A4?的问题似乎是竞赛条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这有助于团队...
#32762021年2月18日作者 ThomasPof2 个回答
这个问题是关于 MJML 代码的,但我觉得这更多是关于 grapesjs 而不是 grapesjs-mjml 有一个函数可以移除“src/code_manager/model/HtmlGenerator.js”中不必要的ID。这个函数在 HTML 标签上表现良好,但在 MJML 标签上就不行了。 我发现的是
artf
https://github.com/artf/grapesjs/releases/tag/v0.16.41
ClaudeCode
谢谢你举报,@ThomasPof。 感谢你分享关于CleanId函数无法与MJML代码配合的报告。为了帮助团队调查并优先排序: 请提供: 一个最小可复现的例子(CodeSandbox/JSFiddle) 你的GrapesJS版本号 浏览器和操作系统信息 浏览器控制台的任何错误信息 重现问题的步骤 最有帮助的是什么: 简约代码示例(不是你整个项目) 屏幕录制或截图显示问题 明确区分预期行为与实际行为 你正在使用的GrapesJS配置 有了这些细节,维护者可以更快地识别和优先排...