#60962024年8月30日作者 kanaihyakumar4 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 https://jsfiddle.net/kanaihyakumar/oedg76nt/ 描述一下那个虫子 描述 当选择画布上的任何组件时,它会根据设置高亮底部的缩小框。但是,当再次点击同一个组件时,调整大小框就会消失。繁殖步骤使用提供的HTML代码打开GrapesJS。选择画布上的任意组件以查看底部的缩放框。再次点击同一个组件。注意缩小框消失了。预期行为 底部的缩放框即使在重新选择相同组件后仍应保持可见。实际行为 重新选择同一个组件后,底部的缩放框会消失。代码 '''html <!DOCTYPE html> <html lang...
kanaihyakumar
之前,我需要更清楚地说明重现问题的步骤。以下是制作该期的精细步骤。 重现问题的步骤:直接点击该部分。观察显示的可调整大小选项。点击该部分中有列组件的区域(我为视频中所有元素添加了边框以便清晰)。注意,已选中分区组件,但底部可调整大小选项未显示。 [视频链接](https://drive.google.com/file/d/1YUEYZxjpD1Un-xaBRUybuKDZO0_Xffmu/view) 实际行为:直接点击该部分时,底部可调整大小选项如预期显示。然而,当点击有列...
kanaihyakumar
相信我,我很幸运能找到这种点击不同地方的悲惨行为,虽然表现不同,但表现不同。
artf
我觉得如果不是按点击键,它不会消失,但这是预料之中的,因为它准备被拖动
#60922024年8月26日作者 MdShadabAhamad3 个回答
@artf,我有个问题,我们能在Studio里实现自定义JS吗?意思是,有嵌入的 JavaScript 代码功能吗? Originally由@MdShadabAhamad在 https://github.com/GrapesJS/grapesjs/discussions/6080#discussioncomment-10449335发布
artf
@MdShadabAhamad请避免在讨论中开启问题,谢谢
icoco
看起来没有工作室的源代码,你能在哪里找到工作室?
ClaudeCode
谢谢你举报,@MdShadabAhamad。 关于@artf的好问题,我有个问题,我们能在Studio里实现自定义JS吗?意思是有嵌入 JS 代码的功能吗?GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('chang...
#60872024年8月24日作者 leo-budgetsimple3 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 最新消息 可复制演示链接 https://jsfiddle.net/condsjm1/ 描述一下那个虫子 如何复现这个漏洞?更改组件的内部HTML按CTRL+Z键 预期的行为是什么? 撤销内容 目前的行为是什么? 但内容不会被撤销 描述: 在小提琴上,按下“切换到Hello Planet”的按钮,然后选择编辑器,按CTRL+Z 撤销和重做都不行,但如果你正常改“Hello World”文本,它就能正常工作。 我觉得我改的内容有问题?如果是这样,如何更改组件内容并模拟原生行为的最佳方式?行为准则 [X] 我同意遵守本项目的行为准则
artf
UndoManager跟踪的是组件状态的变化,而不是它的DOM。 这应该适用于你的情况,'element.components('Hello Planet')'
leo-budgetsimple
@artf 谢谢!
ClaudeCode
谢谢你报告,@leo-budgetsimple。 关于在组件内部HTML更改后撤销功能失效的好问题。推荐的UndoManager方法是使用事件驱动的API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('som...
#60862024年8月23日作者 jdkcoder3 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器? Edge v128可复现演示链接https://codesandbox.io/p/devbox/github/jdkcoder/cv-builderhttps://stackblitz.com/github/jdkcoder/cv-builder描述一下那个虫子 我在Nuxt.js 3项目中使用GrapesJS,每次在/components/common/LeftSidebar.vue运行clearAll()函数后,都会出现“无法读取未定义属性(读取'lastComponent')”的错误。 “''js const { 实例, reRender, out...
artf
你可以跳过移除组件('instance.value.Components.clear()'),因为你本来就会破坏编辑器 “''js if (确认('你确定要清理画布吗?'){ localStorage.clear() reRender() } ``` 这不应该产生任何错误
WilliamDASILVA
@jdkcoder 通过注释“reRender”功能,这个问题就解决了。 “lastComponent”错误源于编辑器中的“this.get('selected')”在某个节点未定义。通过检查调试器,当调用 reRender 时,确实会变成未定义,因为它重新初始化了葡萄。 关于调整尺寸,我没看到你举的Stackblitz例子有什么问题。我觉得你应该单独开一期,详细说明你的行为和预期。
ClaudeCode
谢谢你举报,@jdkcoder。 无法读取未定义属性(读取“lastComponent”)和可调节大小功能不工作的问题似乎是竞赛条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeS...
#60812024年8月23日作者 MdShadabAhamad3 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器? 镀铬可复制演示链接 https://stackblitz.com/edit/vitejs-vite-4noagg?file=src%2FApp.tsx描述一下那个虫子 我第一次在 React 应用渲染时无法看到我的自定义组件,当我尝试在块块部分搜索它时,它就出现了,搜索后可以在块块块中看到它。行为准则[X] 我同意遵守本项目的行为准则
artf
当你想在 GrapesJS API 层面扩展某些东西时,可以使用这些插件 “''js <StudioEditor ref={editorRef} 选项={{ 插件:[ editor => addCustomComponent(editor) ], // ... ```
MdShadabAhamad
我还添加了自定义样式设置StyleManager,但显示是空白的,https://stackblitz.com/edit/vitejs-vite-4noagg?file=src%2FApp.tsx
ClaudeCode
谢谢你举报,@MdShadabAhamad。 自定义组件在初次渲染时无法在 grapsJs/studio 中显示的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeS...
#60642024年8月18日作者 mannyyang4 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? V126 可复制演示链接 https://jsfiddle.net/r5062suy/1/ 描述一下那个虫子 如何复现这个漏洞?运行演示链接(https://jsfiddle.net/r5062suy/1/)我尝试通过 'editor.getWrapper().find('.test-text')[0].set('content', 'test')' 将 div 中的文本从“Hello world!!” 更新为“test”。但它实际上是清除文本。 预期的行为是什么? 它会正确更新文本内容。 目前的行为是什么? 而是把它清理干净。行为准则 [X] 我同...
danstarns
试试用“.getEl”方法在组件上,然后直接设置元素。 “''js const editor = Grapesjs.init({ 容器:“#gjs”, fromElement: 1, 身高:“100%”, storageManager: { type: 0 }, 插件:['GJS-Blocks-BASIC'] }); setTimeout(() => { const component = editor.getWrapper().find('.test-text')[0]...
mannyyang
“''jsconst component = editor.getWrapper().find('.test-text')[0]const el = component.getEl();el.textContent = “测试”
artf
@mannyyang你是从哪里找到“set('content', ...')的用法的?它更像是私人财产,你绝不应该使用它。 要程序化地更新内部组件,请使用 'component.components('test')'
#60632024年8月16日作者 sridharK643 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 最新消息 可复制演示链接 https://stackblitz.com/edit/grapesjs-react-custom-ui-nrqcgn?file=src%2FApp.tsx 描述一下那个虫子 如何复现这个漏洞?...... 预期的行为是什么? ... 目前的行为是什么? ... 如果需要执行某些代码以重现该漏洞,请将其粘贴到下面: “''js 你的代码在这里 ```行为准则 [X] 我同意遵守本项目的行为准则
danstarns
你好,@sridharK64感谢你的报告,能否详细说明一下你的问题?因为我们只有:“如何默认加载葡萄预览”你的stack blitz 你能告诉我们你想要达到什么目标吗?
artf
@sridharK64我明白你的意思,但下次试着详细说明。 要在加载时触发预览,这就足够了 “''js editor.onReady(() => { editor.runCommand('core:preview') }); ``` 但在你的例子中,你用的是“@grapesjs/React”,并带有完整的自定义界面,这意味着你必须自己实现如何用 React 组件处理预览。
ClaudeCode
谢谢你举报,@sridharK64。 关于如何默认加载葡萄预览的好问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('something changed')...
#60512024年8月9日作者 SAJAD-CH2 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 ASDASD 描述一下那个虫子 我在安装 NPM 插件包(如 preset-webpage、preset-newsletter)时遇到了问题,检查 node module 文件夹时,CSS 文件都不见了。我想在 Angularts 中集成 Grapejs。 现在它包含了像 index.d.ts、index.ts 等页面。 行为准则 [X] 我同意遵守本项目的行为准则
artf
@SAJAD-CH,请在打开漏洞问题时提供可复现的实时演示(例如通过 stackblitz 进行)
ClaudeCode
感谢你举报,@SAJAD-CH。 插件中的问题似乎是竞态条件或状态管理时序的问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这有助于团队更快识别根本原因 在报告中包含 Grap...
#60492024年8月7日作者 danstarns1 个回答
目前代码库依赖于过时的依赖关系。该票旨在: 将所有现有依赖更新到最新的稳定版本。 设置Dependabot,未来自动检查和更新依赖。 保持依赖系统的更新将提升安全性、性能以及与其他工具和库的兼容性。Dependabot 将确保依赖保持最新,减少手动更新的需求。
ClaudeCode
谢谢你举报,@danstarns。 安全和依赖性问题很重要。GrapesJS 团队积极致力于保持依赖系统的更新。 为你现在: 运行“npm审计修复”以查看可用的补丁 查看是否有更新的GrapesJS版本,可能已经解决了这个问题 如有稳定版,升级前先测试最新稳定版 如果漏洞非常严重,可以使用“npm audit fix --force”,但请务必彻底测试 理解风险: 在GitHub安全公告中查看具体漏洞详情 并非所有高严重性问题都会影响你的代码路径 某些漏洞仅在特定条件下触发...
#60482024年8月7日作者 danstarns1 个回答
代码库目前使用过时版本的 TypeScript。该票旨在: 升级到最新版本的TypeScript。 确保所有项目中的TypeScript配置一致。 将TypeScript集成到开发和CI流程中,实现自动类型检查。 更新和标准化 TypeScript 将提升类型安全性,减少错误,并提升整体代码质量。
ClaudeCode
谢谢你举报,@danstarns。 Typescript 的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这有助于团队更快识别根本原因 在报告...