GrapesJS 问题

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

状态

排序

找到 3,464 个问题

#29702020年8月24日作者 MarksEliel1 个回答

1 个反应

无效问题

在编辑器末尾插入组件的问题

增加组件间的余距，或在编辑器末尾插入余距。我在添加组件时遇到了一个问题，它会放在前 div 里面。

RJCAM

你好@MarksEliel 请在提交错误报告时遵循默认指南，以便更好地理解你的问题。警告请阅读并遵循接下来的三步，然后在发布问题前删除它们遵守贡献指南 https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.md先快速搜索一下，看看有没有人没开同样的问题所有相关陈述/问题都必须填写/回答，否则问题可能已结案JSFiddle 入门模板 https://jsfiddle.net/szLp8h4nCodeSandbox...

查看详情

#29682020年8月24日作者 gunslingor3 个回答

1 个反应

问题：尝试在样式下设置“设置”扇区

https://github.com/artf/grapesjs/issues/1627 我觉得问题特别针对这行，我也遇到了同样的问题。我看了演示版，但这个类只出现在CSS和这行里，所以这个选择器返回的是未定义的，不是吗？是什么元素有这个功能，才能然后添加它？ traitsProps.append($('.gjs-trt-traits')); 演示版里确实能用，但我不明白怎么做到的...... 尝试用KotlinJS求解，注意：确保它在装载室内Notice var $ = grapesjs.$; getElementBy doesn't work, but I don't understand what this is doing...

gunslingor

好的，我想我明白了。我需要很多不同版本的 grapejs 画布......每个都应该是独立的插件，有时可能共享共同代码。我之前的想法不同，预设只是可以覆盖的设置，但更像是预设本身就是完整的解决方案......现在我得学会做插件，开始吧！

Nikesh-hub

你好@gunslingor 在呼叫特质区之前，你需要先激活两部分 settingButton && settingButton.set（'active'， 1）; styleManagerButton && styleManagerButton.set（'active'， 1）; 然后你可以打电话 -- 添加设置扇区 |var traitsSector = $（'<div class=“gjs-sm-sector no-select”>'+ |'<div class=“gj...

gunslingor

是的，我最终弄明白了。我不明白为什么我必须在初始化后才配置这个部分，而不是像许多其他面板/部分那样在初始化时配置。我觉得是因为我用的是预设插件。我觉得如果你用了，init应该很简单，然后再修改，但我没有确切证据，也不知道为什么。这样说对吗？还是你可以同时使用预设插件并在初始化时配置特征？

查看详情

#29672020年8月24日作者 gunslingor3 个回答

1 个反应

警告：找不到插件 grapesjs-style-gradient

https://github.com/artf/grapesjs/issues/1156 其实是浏览器控制台警告，不是错误：“index.js？08a9：70 插件 grapesjs-style-gradient 未找到” 我在上面工单上发布的小提琴演示中看到的唯一区别是，你在外部链接，而我在内部连接（我用的是kotlin DSL）：你我 'script（src = “/libs/grapesjs/js/grapick.min.js”） {}' 注意：无论有没有警告，一切似乎都运行得很完美。只是猜测，也许是其他插件想拿到，比如预设？附言：我很喜欢这个框架 =）

Ju99ernaut

澄清一下，'grapick.min.js'确实存在，只是它和'grapesjs-style-bg'或'grapesjs-style-gradient'捆绑在一起，所以在使用这两个插件时不会包含它，但我们必须包含'grapick.min.css'，因为它没有被这些插件捆绑，而且是做渐变滑块样式的必需。另外，'grapesjs-preset-webpage' 和 'gjs-preset-webpage' 是同一个插件，另一个只是别名。

Ju99ernaut

试试“script（src = ”/libs/grapesjs/js/grapesjs-style-gradient.min.js“）{}'，'grapick' 和 'grapesjs-style-gradient' 是不同的项目，也建议用 'grapesjs-style-bg' 代替 'grapesjs-style-gradient'

gunslingor

我注意到演示中他们用的是grapick.min.css，style-bg.min.js也写在了标题里，但没有grapick.min.js（存在）或style.bg.min.css，这让我觉得很奇怪;我现在明白了，我在配置时试图添加 grapesjs-style-gradient“（gradient）的插件和 pluginOpts，但没有在标题里包含，所以我很可能用的是”grapesjs-style-bg“（演示里不知为何没有 pluginsOpts）或者 grapick。真...

查看详情

#29662020年8月23日作者 juancarlospaco3 个回答

3 个反应

问题：插件块类别

我写了一个插件，运行得不错，我看了文档，但有没有办法默认让类别折叠？因此用户点击插件以显示插件块。

Ju99ernaut

有没有办法把“查看代码”按钮样式成带有</>图标的那个？用 css 选择器来锁定按钮，比如 .gjs-pn-btn.fa.fa-code在“查看代码”弹窗中，有没有办法隐藏CSS文本编辑器，只保留HTML编辑器？为什么我的 grapes 和官方演示版的界面/风格不同？主题设计有解释 [这里]（https://grapesjs.com/docs/getting-started.html#themeing）

Ju99ernaut

你可以用 “''js const pn = 编辑器。面板; const bm = 编辑器。方块 const openBl = pn.getButton（'views'， 'open-blocks'）; editor.on（'load'，（） => { openBl & & openBl.set（'active'，1）; bm.getCategories（）.forEach（c => c.set（'open'， 0））; });

juancarlospaco

谢谢，[你可以在这里查看结果]（https://juancarlospaco.github.io/grapespectre）。我在这里请求不要再打开更多虫子：有没有办法让“查看代码”按钮样式为带有 </> 图标的按钮？在“查看代码”弹窗中，有没有办法隐藏CSS文本编辑器，只保留HTML编辑器？为什么[我的 grapes]（https://juancarlospaco.github.io/grapespectre）的UI/风格与[官方演示版]（https://grapes...

查看详情

#29652020年8月22日作者 gunslingor2 个回答

0 个反应

专长：插件名称

请求允许我用两个约定来称呼插件：“grapesjs-lory-slider”和“grapesjsLorySlider”。我用的是Kotlin JS DSL，但它无法处理破折号;此外，通常破折号保留给CSS类名称，在JS中应最小化......虽然我怀疑确实有一个同名类，但为了避免混淆并防止未知问题，应该与 JS 对象名称解耦。

gunslingor

我确实找到了一个解决方案[“grapesjs-lory-slider”]，仍然推荐添加。

artf

说实话，我看不出举办两个大会有什么好处。带有破折号的名称由Webpack UMD捆绑器生成（例如使用grapesjs-cli），该名称取自package.json“name”。如果社区会有更多请求和解决方案提出，我可能会重新开放。

查看详情

#29642020年8月21日作者 Nikesh-hub1 个回答

1 个反应

除非请求，特质不会默认创建，事实上我在演示中就是这么做的 https://github.com/artf/grapesjs/blob/gh-pages/demo.html#L1407-L1408

除非请求，特质不会默认创建，事实上我在演示中就是这么做的 https://github.com/artf/grapesjs/blob/gh-pages/demo.html#L1407-L1408 Originally由@artf在 https://github.com/artf/grapesjs/issues/1627#issuecomment-445216188发布你好，artf 你能给出一个合适的示例吗？我们如何请求特质

Ju99ernaut

“''js const openTmBtn = 编辑器。Panels.getButton（'views'， 'open-tm'）; openTmBtn & openTmBtn.set（'active'，1）; ```

查看详情

#29632020年8月19日作者 jamejillagit2 个回答

1 个反应

通过远程存储加载的模板不会在编辑器中显示

你好，我试图从远程存储加载默认模板到编辑器，但什么都没有显示。作为初始化的一部分，我有以下代码： storageManager： { 类型：“远程”，自动保存：正确，自动加载：正确， stepsBeforeSave：3， urlStore：“https://myendpoint/lib/remotestorageloadtemplate.php”， urlLoad：“https://myendpoint/lib/remotestorageloadtemplate.php”，参数：{}， contentTypeJson： true， }, 这是我urlLoad中的PHP代码： header（'Content-Type： a...

mcottret

你好@jamejillagit！根据[DOM组件加载方式]（https://github.com/artf/grapesjs/blob/dev/src/dom_components/index.js#L382），似乎只要“gjs-components”属性是定义且有效的（数组、对象或JSON字符串），GrapesJS会优先从“gjs-components”属性加载，而不是“gjs-html”属性。如果你明确想从 'gjs-html' 加载，我认为你的端点不应该返回 'g...

artf

@jamejillagit一定要读过这篇 https://grapesjs.com/docs/modules/Storage.html 如果你是回加载HTML来更新模板，会遇到问题

查看详情

#29622020年8月19日作者 SintoDema3 个回答

1 个反应

BUG：

你好，@artf，版本： grapesjs - 0.16.18 CKeditor - 标准 - 4.14.1 你能重现演示中的bug吗？是的预期的行为是什么？在应用内联 CKeditor 选项中的内联格式选项时，这应该反映在所选文本中。详细描述那个漏洞我已经把CKeditor集成到 grapesJS 编辑器里用于内联编辑。目前，当我选择文本格式化时，内联CK编辑器选项和其他几个选项都显示在黑色工具栏里。我对此感到困惑。主要问题是即使我使用任何内联格式选项，格式也没有反映在所选文本中。CKeditor的内联选项无法做任何操作，比如文本格式化、列表、图片上传、链接等。目前的行为是什么？主要问题是即使我使用任何内嵌选项，...

SintoDema

你好@mcottret，你的回复非常有帮助。它解决了与内联格式相关的全部问题。谢谢。

mcottret

你好@SintoDema！ [GrapesJS CKEditor 插件]（https://github.com/artf/grapesjs-plugin-ckeditor）已经把 CKEditor 注册为自定义 RTE，所以调用 'editor.setCustomRte' 实际上是要设置两次，我认为这会导致这些问题。移除'editor.setCustomRte'块，它应该能正常工作。如果你想提供 CKEditor 选项，应该在 'pluginsOpts' 级别完成，如这里...

SintoDema

你好@mcottret，我之前已经试过了，按照你的建议，我已经把那部分从申请中移除了。现在没有格式选项标签。我在 CKEditor 选项中没有设置任何限制（''pluginsOpts''），只是在 GrapesJS 插件的部分加载了 CDN 文件和插件名称。另外，在移除“editor.setCustomRte”'' 块后，我又出现了一个错误：你能重现演示中的bug吗（在移除“editor.setCustomRte”''块后，你可以试试）**？是的这里有一张演示截图（...

查看详情

#29612020年8月18日作者 kuhelbeher3 个回答

1 个反应

BUG：自定义模态中的组件无法编辑

你好，我正在尝试向我的项目添加自定义模态块，并且想用拖放功能更改这个模态的内容。这是我的模态区块代码： “JavaScript 编辑。BlockManager.add（“modal”， { 标签：“Modal”，分类：“基础”，内容：{ 内容： <button type=“button” class=“modal-open-button”>Open modal</button> <div class=“modal-wrapper”> <div class=“modal-content”> <div class=“modal-contentheader”> <h3 class=“modal-contenttitle”>Modal...

Ju99ernaut

也许可以用“图层”面板，或者像#2772号问题中展示的那样禁用脚本

Ju99ernaut

我觉得“内容”字段被视为纯文本，所以应该用“组件”字段： “''js 编辑。BlockManager.add（“modal”， { 标签：“Modal”，分类：“基础”，内容：{ 组件： <button type=“button” class=“modal-open-button”>Open modal</button> <div class=“modal-wrapper”> <div class=“modal-content”> <div class=“modal-c...

kuhelbeher

@Ju99ernaut谢谢你的好建议。成功了。但现在我遇到了另一个问题——我该如何选择“打开模态”按钮来进行样式或修改？当我点击“打开模态”按钮时，模态会被打开。我能以某种方式阻止触发这个事件吗？这里有[演示]（https://codesandbox.io/s/grapes-modal-block-click-zxbcy?file=/src/index.js）

查看详情

#29602020年8月17日作者 jayeshmotwani3 个回答

0 个反应

BUG：扇区内边际和填充属性的界面

你好，我正在用下面的代码创建一个仅用于边距和填充的扇区：该行业的创建方式是基于保证金属性，如下截图所示： ![Grapes js 边距配置 ]（https://user-images.githubusercontent.com/27188013/90367227-2f2ded80-e086-11ea-94dd-4e312728e731.PNG）如你所见，这些属性放在同一行。我希望它们只作为两个属性排行显示。请参考下面的截图了解更多信息： ![Grapes js 宽度和高度位置（https://user-images.githubusercontent.com/27188013/90367374-69978a80-e086-1...

RJCAM

你好，@jayeshmotwani，你用的是哪个版本？我刚刚复制粘贴了你的代码，看起来和你预期的一样工作，就像第二张图里那样，而不是第一张。我在演示中也这么做过，效果很好，属性用两个道具在同一行组织。见下文： ![图片]（https://user-images.githubusercontent.com/49693237/90389536-e3bd1480-e070-11ea-82b8-7b7b46952a04.png）

jayeshmotwani

你好，@RJCAM，谢谢你的回复。我使用的是0.16.18版本

jayeshmotwani

啊！我刚意识到！这是因为我把面板尺寸加大了！

查看详情

GrapesJS 问题

浏览所有主题