#34802021年5月25日作者 samichamoun4 个回答
我注意到如果我在初始化函数中设置高度,它会根据特定的像素数量来设置,比如“500px”。但是如果你尝试用百分比设置,比如高度:“90%”,编辑器根本没有高度。 另外我也想知道,如果什么都没设置,为什么设置了高度,因为它似乎自动计算了一个像素数量,占用了整个页面(比如100%)。 我实际上把编辑器包裹在我们CMS后台的标准页面模板里,这个页面模板在侧边菜单栏里有更多内容,迫使页面变成可滚动页面(也就是页面模板的内容总是在屏幕折叠下方)。这让编辑器功能非常差,因为如果你想在编辑器下方滚动,就必须把光标移出编辑器并滚动,这会导致用户体验很差。 我还有一个“保存”按钮,可以提交到表单,但这不属于编辑器,所以要进入保存按钮,你得再次把光标移...
ahmedderkaoui
尽量用'VH'代替'PX'。 例如:给编辑器“height: '80vh'',给导航栏'height: '20vh'''。这样,只要所有元素的“vh”之和≤100,纵向滚动就永远不会显示或需要 希望这些信息对你有帮助。
samichamoun
尝试用“VH”代替“px”。例如:给编辑器“height: '80vh'',你的导航栏'height: '20vh''。这样,只要所有元素的“vh”之和≤100,纵向滚动就永远不会显示或需要希望这些对你有帮助。 谢谢,这很有用!
artf
这更多是布局问题,与GrapesJS编辑器本身无关。
#34772021年5月24日作者 ahmedderkaoui2 个回答
默认情况下,当“init”不包含以下内容时,编辑器会以英文启动: 然而,当我尝试用 i18n 方法更改语言时:“setMessages”,如下所示: “编辑。I18n.setMessages({ en: tr });' 这种情况发生:打开的标签页(比如默认加载时打开的样式管理器)不会被 i18n 更新。悬停面板标题不会更新。未加载的标签页(比如特性管理器)会被 i18n 更新(因为之前未加载)
ClaudeCode
谢谢你举报,@ahmedderkaoui。 感谢你分享关于setMessages()不会更新i18n的报告。为了帮助团队调查并优先排序: 请提供: 一个最小可复现的例子(CodeSandbox/JSFiddle) 你的GrapesJS版本号 浏览器和操作系统信息 浏览器控制台的任何错误信息 重现问题的步骤 最有帮助的是什么: 简约代码示例(不是你整个项目) 屏幕录制或截图显示问题 明确区分预期行为与实际行为 你正在使用的GrapesJS配置 有了这些细节,维护者可以更快地识...
#34762021年5月24日作者 krishnaeverestengineering3 个回答
<img width=“1172” alt=“截图 2021-05-24 下午6:55 23” src=“https://user-images.githubusercontent.com/55732888/119354444-b8cbb500-bcc1-11eb-8e67-27e020c879aa.png”> 我在编写单元测试时遇到过这个错误,我正在测试编辑器实例的定义。随机测试用例通过,但大多数时候我遇到的是这个错误。
YyueeiWY
看起来你缺少了类名或父元素ID。 下面是使用 querySelector 的示例。 <pre> var parentElement = document.getElementById('deviceready'); var listeningElement = parentElement.querySelector('.listening'); console.log(listeningElement); <div id=“deviceready”> <d...
artf
抱歉,这可能取决于太多因素(比如环境),与核心本身无关。
ClaudeCode
谢谢你举报,@krishnaeverestengineering。 TypeError: Cannot read properties 'querySelector' of null 的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试...
#34752021年5月24日作者 ThetripGr2 个回答
版本: 0.16.44 你可以在控制台输入“grapesjs.version”获得版本 你能重现演示中的bug吗?[x] 是的[ ] 不 预期的行为是什么? 每个实例都有自己的工具栏正常工作 详细描述那个漏洞 之前我又提出了一个关于实例#3354的问题,在这个问题中,我认为是我处理实例不当导致了问题。我甚至在演示页面里也遇到了这个 https://grapesjs.com/docs/getting-started.html#theming。你可以看到,在每一个实例中,工具栏都无法使用,提供的选项(加粗、删除线、链接等)都没有,只有最后一个启动的实例例外。我的情况也是这样(工具栏只在最后一个启动的实例上工作)。 你能附上截图、截屏或...
artf
谢谢你的报告@DodoTrip 修复已经准备好,准备下一次版本。
ClaudeCode
谢谢你举报,@ThetripGr。 工具栏/动作栏按钮在多个实例存在时无法工作(即使在你的演示中)似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这...
#34722021年5月24日作者 YyueeiWY2 个回答
版本: “Grapesjs”: “^0.17.3” “Grapesjs-preset-webpage”: “^0.1.11” 你可以在控制台输入“grapesjs.version”获得版本 你能重现演示中的bug吗?[x] 是的[ ] 不 目前的行为是什么? css 属性(-webkit-background-clip:text;)在 grapesjs-preset-webpage(导入时消失)中无法使用。 但在Grapesjs官方演示中它能用。 https://grapesjs.com/demo.html GrapesJs 的官方演示源和插件 grapesjs-preset-webpage 有区别吗? 详细描述那个漏洞 我正在尝...
YyueeiWY
好的,我用 **grapesjs-parser-postcss 来解决的 我不知道有CSS解析器插件。 https://github.com/artf/grapesjs-parser-postcss
ClaudeCode
谢谢你举报,@YyueeiWY。 CSS 属性(-webkit-background-clip:text;)在 grapesjs-preset-webpage 中无法使用。 似乎是竞态条件或状态管理时序的问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的...
#34702021年5月22日作者 iabhiyaan1 个回答
警告 请阅读并遵循接下来的三步,然后在发布问题前删除它们遵守贡献指南 https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.md先快速搜索一下,看看有没有人没开同样的问题所有相关陈述/问题都必须填写/回答,否则问题可能已结案JSFiddle 入门模板 https://jsfiddle.net/szLp8h4nCodeSandbox 入门模板 https://codesandbox.io/s/1r0w2pk1vl 版本: 你可以在控制台输入“grapesjs.version”获得版本 你能重现演示中的bug吗?[ ] 是的[x] 不 预期的行为是什么? 详细描述那个漏洞...
ClaudeCode
谢谢你举报,@iabhiyaan。 问题:当选中组件时,我们如何激活右上角面板的特性管理器似乎是竞争条件或状态管理时序的问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这有助于...
#34632021年5月18日作者 anatoli-dp4 个回答
警告 请阅读并遵循接下来的三步,然后在发布问题前删除它们遵守贡献指南 https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.md先快速搜索一下,看看有没有人没开同样的问题所有相关陈述/问题都必须填写/回答,否则问题可能已结案JSFiddle 入门模板 https://jsfiddle.net/szLp8h4nCodeSandbox 入门模板 https://codesandbox.io/s/1r0w2pk1vl 版本: 你可以在控制台输入“grapesjs.version”获得版本 你能重现演示中的bug吗?[ x] 是的[ ] 不 预期的行为是什么? 当将任何东西堆叠...
anatoli-dp
也许可以把控件放在文本前面,然后对每个缩进或叠加的项目稍微偏移整个框。这样你可以随意堆叠,我🤷最终会自己做解决方案来实现,但因为我不懂你的代码结构,帮不上太多忙。但如果默认是这样就更好了
artf
是的,不幸的是,默认图层面板的可扩展性不高,我们需要重新考虑渲染方式
artf
是的,把控件移到文本前面听起来很合理(比如只在我把鼠标悬停在组件时才显示)。 总之,虽然结构不那么混乱,我不会把这个问题放在优先级上,但如果能解决这种限制肯定很酷。 如果有人需要帮助,这里可以查看图层管理器的视图:https://github.com/artf/grapesjs/blob/dev/src/navigator/view/ItemView.js
#34622021年5月18日作者 ahmedderkaoui3 个回答
有没有办法重新渲染或刷新画布中所有组件的特性(这些特征是自定义的,不是内置的)?
iabhiyaan
“''js editor.on('component:selected', component => { component.set({ 特质:['名字','占位符'] }) }) ````
artf
嗯,这有什么意义?你的自定义特征应该已经能对组件变化做出反应(前提是你正确创建了它们)。
ClaudeCode
谢谢你举报,@ahmedderkaoui。 关于刷新/重新渲染所有组件在画布中特性的好问题。推荐的 Canvas 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('something...
#34612021年5月17日作者 ahmedderkaoui1 个回答
我知道有一个函数可以重新渲染一个特征的视图。 不过,我仍然不知道该怎么用,也不知道该在哪里使用。
ClaudeCode
谢谢你举报,@ahmedderkaoui。 关于在选定组件上重新渲染特性的好问题。推荐的组件方法是使用事件驱动的API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('something changed'));...
#34602021年5月17日作者 Redix02 个回答
错误: (节点:206)UnhandledPromiseRejectionWarning:类型错误:无法读取未定义的属性“get” (节点:206)未处理承诺拒绝警告:未处理承诺拒绝。该错误要么源于在没有捕捉块的异步函数中抛入,要么是拒绝了未用 .catch() 处理的承诺。要在未处理的承诺拒绝时终止节点进程,可以使用CLI标志“--unhandled-rejections=strict”(参见 https://nodejs.org/api/cli.html#cliunhandledrejectionsmode)。(拒绝编号:1) (节点:206)[DEP0018]弃用警告:未处理的承诺拒绝将被弃用。未来,未被处理的承诺拒绝将以非...
ClaudeCode
谢谢你举报,@Redix0。 安全和依赖性问题很重要。GrapesJS 团队积极致力于保持依赖系统的更新。 为你现在: 运行“npm审计修复”以查看可用的补丁 查看是否有更新的GrapesJS版本,可能已经解决了这个问题 如有稳定版,升级前先测试最新稳定版 如果漏洞非常严重,可以使用“npm audit fix --force”,但请务必彻底测试 理解风险: 在GitHub安全公告中查看具体漏洞详情 并非所有高严重性问题都会影响你的代码路径 某些漏洞仅在特定条件下触发 保持...