GrapesJS 问题

已收录 3,464 个 GitHub 问题 370 个已解决 · 90 个待解决 搜索、筛选并探索经过实战检验的答案。

找到 3,464 个问题

#33132021年3月5日作者 fahad1574 个回答
2 个反应

让文本可编辑需要大量点击,我们能让文本字段在一次点击中可编辑吗?

警告 请阅读并遵循接下来的三步,然后在发布问题前删除它们遵守贡献指南 https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.md先快速搜索一下,看看有没有人没开同样的问题所有相关陈述/问题都必须填写/回答,否则问题可能已结案JSFiddle 入门模板 https://jsfiddle.net/szLp8h4nCodeSandbox 入门模板 https://codesandbox.io/s/1r0w2pk1vl 你想给GrapesJS添加什么? 详细描述你的功能需求详细 最新版本有替代方案吗? [ ] 是的(描述另一种情况) [ ] 不 这是否与某个问题有关? [ ]...

Andrew-Chen-Wang

拖动方块时单击操作会让人烦。如果你已经选好了方块,仍然需要双击。如果你没选中某个区块,那你只需双击该区块来编辑文本。我觉得这已经很常见了。

fahad157

@Andrew-陈王:是的,没错,但我的情况是想用单击编辑,如果可能的话请指导一下。

mihir-khandekar

你@fahad157解决的?

#33122021年3月5日作者 Andrew-Chen-Wang3 个回答
0 个反应

专长:侧板宽度改为20%

你想给GrapesJS添加什么? 侧板看起来被揉皱了。除非你的桌面很大,否则我不太希望块面板的图片被放到一边。此外,顶部的图标,比如“获得新方块”图标,除非屏幕较大,否则会被遮挡。 详细描述你的功能需求详细 将侧面板宽度从15%改为20%,具体来说是类别:'gjs-pn-views-container' 最新版本有替代方案吗? [ ] 是的(描述另一种情况) [X] 不 这是否与某个问题有关? [ ] 是的(请提供本期链接) [X] 不

Ju99ernaut

目的是最大化画布覆盖的面积,但你也可以用自定义CSS轻松更改面板大小。

Andrew-Chen-Wang

当然,我只是觉得试玩版不应该看起来像那样皱巴巴的:P那我想这只是个人看法。

ClaudeCode

谢谢你举报,@Andrew陈旺。 关于FEAT:把侧板宽度调到20%的好建议!虽然这个具体功能还没有出现在核心 API 中,但有几种方法可以实现类似的行为。 使用事件系统: “JavaScript editor.on('component:update', (component) => { 你的逻辑 }); ``` 替代方法: 听取“selector:add”以获取CSS选择器更改 使用“selector:custom”来表示自定义规则 利用“change:*”事件进行细致...

#33102021年3月5日作者 Andrew-Chen-Wang3 个回答
3 个反应

平板和手机视图无法调整大小

版本: 演示版中的那个 你能重现演示中的bug吗? [X] 是的 [ ] 不 预期的行为是什么? 移动端和平板视图在窗口缩小时应该会调整画布大小。 详细描述那个漏洞 桌面视图在调整窗口大小时会正确调整画布大小 目前的行为是什么?* 当窗口在移动端和平板视图中缩小到一定宽度以下时,画布不会变大。面板随后覆盖了画布。这在桌面视图中不会发生,只有在移动端和桌面视图中才会出现。 详细描述那个漏洞*** 桌面视图在调整窗口大小时会正确调整画布大小。但只有桌面视图。移动端(包括竖屏和横屏)和平板视图不会调整大小

Ju99ernaut

“移动”和平板“设备是像素延迟的,所以它们只是根据窗口大小调整画布大小到一定像素数。我记得“桌面”只是把Canvas设置为100%。

artf

正如@Ju99ernaut提到的,这就是设备的工作原理。 说实话,我甚至不明白为什么要调整窗口大小? 你还可能开始看到或更新与正确设备无关的样式,这肯定会让人困惑。

ClaudeCode

谢谢你举报,@Andrew陈旺。 平板和移动视图无法调整大小的问题似乎是竞赛条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这有助于团队更快识别根本原因 在报...

#33092021年3月4日作者 jcamejo4 个回答
0 个反应

TextNodes 在元素内容更改时会干扰

版本: 0.16.44 你好@artf 我有一个自定义方块,带有自定义按钮组件,内容和这个类似。 ` <a data-gjs-type=“custom_button” class=“btn btn-1” href=“”>Click here</a>' 此外,我添加了一个文本特性来更改按钮内容,但在这个特定情况下,我不想使用编辑器RTE。 <img width=“286” alt=“image” src=“https://user-images.githubusercontent.com/1976679/109966677-d3a91180-7cf0-11eb-8463-e28b8de806c2.png”> 当我更改数值时,第一次会...

artf

你好,Juan,谢谢你的报告,你能给我演示一下你的文本特性是怎么工作的吗? 如果你用这种方式更新组件 'component.components(e.target.value)',我预计它应该能正常工作

jcamejo

这是我的特质 我已经改成 现在它不用覆盖更新内容或渲染子节点,谢谢!我绝不会得出使用“组件”方法的结论。 现在我不喜欢文本节点 😅 我觉得除非你还有其他改进点,否则我们可以结束这个问题。 谢谢!

artf

我觉得你不需要这个“target.set('content', value);”。其他的都很好 👍

#33072021年3月3日作者 neon123454 个回答
3 个反应

成就:提供一个未被压缩的版本

有没有被压缩的 Grapesjs 单文件版本? 如果能有个专门的,方便修复漏洞和快速测试新功能/改进,那就太好了。

neon12345

令人失望的是,这个网站刚刚关闭了。当然我可以改变工作流程,但为什么不让大家参与得尽可能舒适呢?

stljeff1

有人能详细解释一下怎么用源地图吗?我在升级到最新的Grapes版本时遇到了非常困难,需要任何能帮忙调试的帮助。 我正在将 grapesjs 导入到 Angular/Typescript 应用中。如果我不包含压缩文件本身,我不明白怎么利用源地图。

Ju99ernaut

这个已经有了,只要用“grapesjs.js”代替“grapesjs.min.js”

#33052021年3月3日作者 RaresVlaiduc3 个回答
11 个反应

(v0.16.41) 点击时按钮未被设置为激活

版本:v0.16.41 你能重现演示中的bug吗? [ ] 是的 [x] 不 预期的行为是什么? 当我点击按钮时,应该会添加 gjs-pn-active 类。 详细描述那个漏洞 我有三个按钮分别对应三台不同的设备(台式机、平板和手机)。 我把它们放在顶部面板上,点击时画布大小会变,但点击的按钮没有被设置为激活。 你能附上截图、截屏或实时演示吗?** [x] 是的(附上) [ ] 不 ![图片](https://user-images.githubusercontent.com/73160095/109790439-164bea80-7c1a-11eb-9aeb-98954166afa2.png) ![图片](https://use...

Ju99ernaut

Grapesjs要求你的命令有“运行”和“停止”功能,才能自动切换面板按钮,所以这可能是问题所在: “''js const cm = 编辑。指挥; Grapesjs 无法在此命令格式下切换面板按钮 cm.add('desktop', e => e.setDevice('Desktop')) Grapesjs 能因为运行和停止而切换面板按钮 cm.add('desktop', { run(e) { e.setDevice('Desktop') }, stop() {} });...

kerryj89

@Ju99ernaut 谢谢你。 现在通过 'grapesjs.init()' 创建 'devices-c' 面板时,active 状态对我来说是正常的。

ClaudeCode

谢谢你举报,@RaresVlaiduc。 (v0.16.41) 按钮点击时未被设置为激活的问题似乎是竞赛条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这有助...

#33042021年3月2日作者 SyedHashimShah3 个回答
2 个反应

我如何自定义Grapesjs的用户界面?

我想自定义 Grapesjs 的界面,但 js 和 css 文件都被压缩了。请告诉我该怎么做?我只是想在界面里保留一些特定的模块,比如图片、文本等。

echobinod

SASS 用于生成压缩后的 CSS 文件。你可以从这里更改样式变量:src/styles/scss/

artf

@SyedHashimShah https://grapesjs.com/docs/getting-started.html

ClaudeCode

谢谢你举报,@SyedHashimShah。 关于我如何自定义Grapesjs的用户界面? 这个问题很棒。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.l...

#33032021年3月2日作者 RutujaBadbe4 个回答
1 个反应

类别顺序显示不正确

嗨! 我想在区块管理器中按特定顺序显示这些类别。我查阅了文档和之前的问题,发现了订单属性。于是,我尝试设置了顺序属性。但即使 ORDER 属性正在设置,它还没有按那个顺序显示。我是不是漏掉了什么?或者做错了什么? 我正在做的是: 因此,期望的结果是按顺序查看类别——标题、旋转木马横幅、版块、类别、新闻信件、页脚 但我仍然感受到的是—— ![捕获](https://user-images.githubusercontent.com/53044783/109652612-0387d600-7b86-11eb-88ca-38a9ed0c219a.PNG)

Ju99ernaut

我想你可以把它设为功能请求,我不确定Grapesjs上是否已经有类似的功能。不过如果你把每个类别的块拆分成不同的文件,然后按顺序加载这些文件,可能会更容易管理。

Ju99ernaut

我认为方块添加的顺序决定了类别顺序。

RutujaBadbe

@Ju99ernaut你好!谢谢你的回复。是的。最后我做了。但如果我想动态地做呢?如果有很多区块,保持顺序难道不难吗?

#33012021年3月2日作者 mmotov2 个回答
0 个反应

更改一个复制的元素会影响其他复制的元素

版本:0.16.41 你能重现演示中的bug吗? 是的 预期的行为是什么? 当我复制粘贴元素(例如文本)并做任何修改时,它应该只会更改选中的元素。 目前的行为是什么? 目前,所有复制元素都进行了更改 你能附上截图、截屏或实时演示吗? https://www.loom.com/share/0dcf0cd5e920459fa6879d8154efae76

JamieBunyassi

你是怎么解决的?

ClaudeCode

谢谢你举报,@mmotov。 更改一个复制元素会影响其他复制元素的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这有助于团队更快识别根本原因...

#32982021年3月1日作者 neon123452 个回答
1 个反应

专长:编辑文本时隐藏组件标签

对于放置在页面顶部的文本,组件标签在编辑时可能会重叠并隐藏文本。另外,标签在不在顶部时可能会和文本编辑工具重叠。 编辑文本时隐藏标签可以避免这种情况。

RutujaBadbe

你可以用 badgable : false 隐藏标签 https://grapesjs.com/docs/api/components.html#parameters-3

ClaudeCode

谢谢你举报,@neon12345。 感谢你分享关于完成:编辑文本时隐藏组件标签的报告。为了帮助团队调查并优先排序: 请提供: 一个最小可复现的例子(CodeSandbox/JSFiddle) 你的GrapesJS版本号 浏览器和操作系统信息 浏览器控制台的任何错误信息 重现问题的步骤 最有帮助的是什么: 简约代码示例(不是你整个项目) 屏幕录制或截图显示问题 明确区分预期行为与实际行为 你正在使用的GrapesJS配置 有了这些细节,维护者可以更快地识别和优先排序修复。Gr...

浏览所有主题