GrapesJS 问题

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

状态

排序

找到 3,464 个问题

#34902021年5月27日作者 samichamoun2 个回答

0 个反应

提问文档 typescript

Large images make area of content editor unreachable

你好，比如你在页面上添加一个三列块，然后尝试在每列拖拽非常宽的图片，内容会被拉伸，溢出部分会被隐藏。我们该如何添加垂直滚动条，或者强制编辑器在拖拽图片时限制可查看的大小？目前如果内容超出了那个区域，你就无法在编辑器里访问它。

artf

这更多是布局问题，你可以通过在所有图片中添加你的CSS来轻松解决，比如说，'img { 最大宽度：100%; }`

GJSBlock

谢谢你举报，@samichamoun。关于大图片会使内容编辑器区域无法访问的好问题。GrapesJS 推荐的方法是使用事件驱动 API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式： “JavaScript 留意变化 editor.on（'change'，（） => console.log（'something ch...

查看详情

#34892021年5月27日作者 samichamoun1 个回答

0 个反应

提问 typescript 常规

Large images push out column width in editor view

作为前言，我描述的问题不会影响编辑生成内容的输出，只是在查看编辑器内部的内容时。假设我在编辑器上创建了两列。两者宽度各为50%。如果我把一张大图片拖到这些单元格里，它会把单元格的宽度推得很大，而不是调整大小以适应编辑器容器。我能做些什么来修复这个问题吗？

GJSBlock

谢谢你举报，@samichamoun。关于大图片在编辑器视图中推高列宽的好问题。GrapesJS 推荐的方法是使用事件驱动 API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式： “JavaScript 留意变化 editor.on（'change'，（） => console.log（'something chan...

查看详情

#34862021年5月26日作者 kuhelbeher2 个回答

0 个反应

增强 style-manager 提问文档组件

专长：能够将所有边距、填充等属性合并更改

你好，目前 grapesjs 内置了属性，比如边际、填充，允许用户逐一更改每个属性（margin-top、margin-bottom等）。如果能同时更改所有这些属性会很不错。比如说，有个锁定按钮，启用后会同时更改所有属性，而不是一个一个。它可能看起来像这样： ![图片]（https://user-images.githubusercontent.com/37115006/119662534-2bf83700-be3a-11eb-83ff-09b7b63446d5.png） @artf有没有简单的方法可以用现有的 Grapesjs 工具实现，比如 StyleManager.addType 方法或类似的？

artf

是的，那会很酷，但遗憾的是，GrapesJS 还没有合适的 UI 模块，可以让用户通过重复使用其他组件轻松构建新的 UI 组件，所以 ['StyleManager.addType']（https://grapesjs.com/docs/api/style_manager.html#addtype）是唯一的办法，但在这种情况下，所有元素的构建权就得你自己决定。

GJSBlock

谢谢你举报，@kuhelbeher。关于FEAT：能够将所有边距、填充等属性合并的建议很棒！虽然这个具体功能还没有出现在核心 API 中，但有几种方法可以实现类似的行为。使用事件系统： “JavaScript editor.on（'component：update'，（component） => { 你的逻辑 }); ``` 替代方法：听取“selector：add”以获取CSS选择器更改使用“selector：custom”来表示自定义规则利用“change：...

查看详情

#34852021年5月26日作者 ahmedderkaoui1 个回答

0 个反应

组件提问画布 style-manager typescript

以HTML形式注入到画布的元素不会作为组件表现

考虑一个简单的块：拖到画布时，可以选择该组件，并可修改其设置。现在，我正在这样做，在卡片上添加相同的输入： '$（someElement）.find（“.card”）.html（'<输入类型=“text”/>'）;' 输入输入成功添加，但表现不如之前。它无法被选中、拖拽或删除，因此无法修改设置和样式。有没有办法在特定元素中注入方块？

GJSBlock

谢谢你举报，@ahmedderkaoui。关于元素以HTML形式注入到画布时，不作为组件表现的好问题。推荐的 StyleManager 方法是使用事件驱动的 API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式： “JavaScript 留意变化 editor.on（'change'，（） => console.lo...

查看详情

#34832021年5月25日作者 Palash-Mandal2 个回答

0 个反应

style-manager 组件提问 typescript

非常非常感谢之前的帮助。我还在开发领域比较新手。请帮我下面说

你好，@artf，非常非常感谢之前的帮助。我还在开发领域比较新手。请帮我下面说我需要一个模式，可以获取用户输入，比如块名、分类、HTML、CSS、JS，然后点击保存，把这些存储为新的块管理器。比如如何传递这些数据并存储为 dragabe 组件我设置了调用模态和设置标题也包含内容的按钮，但编辑器未启动图片 ![图片]（https://user-images.githubusercontent.com/17553816/119516278-424bb780-bd94-11eb-86db-812c6c405b1f.png） function buildCodeEditor（type） { var codeEditor = 编辑器...

artf

请遵循议题模板

GJSBlock

谢谢你举报，@Palash-曼达尔。关于*的好问题。推荐的 StyleManager 方法是使用事件驱动的 API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式： “JavaScript 留意变化 editor.on（'change'，（） => console.log（'something changed'））;...

查看详情

#34822021年5月25日作者 Palash-Mandal4 个回答

0 个反应

组件画布 typescript

Runtime updated traits not EDIT mode.

你好@artf 我遇到了关于某个特质的问题。当我拖放方块到画布时，它的特性在设置部分显示得很正常。但当我第二次保存并编辑，并在画布中选择了那个标签时，这个特征现在已经出现在设置的“Section”里了。拜托拜托拜托帮帮我！ '// 自定义标题组件 blockManager.add（'header'， { 标签：“标题”，类别：“组件”， media： '<SVG XMLns=“http://www.w3.org/2000/svg” viewBox=“0 0 24”><path d=“M8.3 11.5h7.4V6.9l-.2-1.6a1 1 0 00-.5-.5c-.3-2-.2-.7-.3-1-.3h-.6v-.4h6.8v...

artf

你是在插件里定义自定义组件吗？

Palash-Mandal

你是在插件里定义自定义组件吗？不用。只要添加init函数 editor = grapesjs.init({ const dc = editor.DomComponents; 自定义标题组件 blockManager.add（'header'， { 标签：“标题”，类别：“组件”， media： '<SVG XMLns=“http://www.w3.org/2000/svg” viewBox=“0 0 24 24”><path d=“M8.3 11.5h7.4V6.9l-...

artf

定义新组件类型的第一个规则是将代码放入插件中。摘自[docs]（https://grapesjs.com/docs/modules/Components.html#define-custom-component-type）

查看详情

#34812021年5月25日作者 zgeist4 个回答

4 个反应

安全依赖常规

Update underscore lib to 1.13.*

当前版本存在安全问题可能是更新到最新版本

igorstasiuk

是的 +1，需要更新到最新的 Underscore 版本

artf

大家好，我把这封邮件作为#3443的重复关闭

kirill-malyhin

渗透测试后也需要修正！

查看详情

#34802021年5月25日作者 samichamoun4 个回答

1 个反应

提问增强 typescript

如何动态控制编辑器的高度，以避免笨重的滚动

我注意到如果我在初始化函数中设置高度，它会根据特定的像素数量来设置，比如“500px”。但是如果你尝试用百分比设置，比如高度：“90%”，编辑器根本没有高度。另外我也想知道，如果什么都没设置，为什么设置了高度，因为它似乎自动计算了一个像素数量，占用了整个页面（比如100%）。我实际上把编辑器包裹在我们CMS后台的标准页面模板里，这个页面模板在侧边菜单栏里有更多内容，迫使页面变成可滚动页面（也就是页面模板的内容总是在屏幕折叠下方）。这让编辑器功能非常差，因为如果你想在编辑器下方滚动，就必须把光标移出编辑器并滚动，这会导致用户体验很差。我还有一个“保存”按钮，可以提交到表单，但这不属于编辑器，所以要进入保存按钮，你得再次把光标移...

ahmedderkaoui

尽量用'VH'代替'PX'。例如：给编辑器“height： '80vh''，给导航栏'height： '20vh'''。这样，只要所有元素的“vh”之和≤100，纵向滚动就永远不会显示或需要希望这些信息对你有帮助。

samichamoun

尝试用“VH”代替“px”。例如：给编辑器“height： '80vh''，你的导航栏'height： '20vh''。这样，只要所有元素的“vh”之和≤100，纵向滚动就永远不会显示或需要希望这些对你有帮助。谢谢，这很有用！

artf

这更多是布局问题，与GrapesJS编辑器本身无关。

查看详情

#34792021年5月25日作者 palash-zinfi1 个回答

0 个反应

常规

Test post

test post

GJSBlock

谢谢你举报，@palash-zinfi。感谢你分享关于测试帖子的反馈。为了帮助团队调查并优先排序：请提供：一个最小可复现的例子（CodeSandbox/JSFiddle）你的GrapesJS版本号浏览器和操作系统信息浏览器控制台的任何错误信息重现问题的步骤最有帮助的是什么：简约代码示例（不是你整个项目）屏幕录制或截图显示问题明确区分预期行为与实际行为你正在使用的GrapesJS配置有了这些细节，维护者可以更快地识别和优先排序修复。GrapesJS团...

查看详情

#34782021年5月25日作者 eyroooon1 个回答

0 个反应

文档画布 style-manager

Using GrapesJS on nextjs

有些 CSS 功能不正常，比如 .gjs-cv-canvas 也无法正常工作。这是我在nextjs上grapejs页面的截图 ![图片]（https://user-images.githubusercontent.com/64449714/119433144-3c2fe980-bd48-11eb-8176-2beab6880396.png）

GJSBlock

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

查看详情

GrapesJS 问题

浏览所有主题