GrapesJS 问题

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

找到 3,464 个问题

#28302020年6月14日作者 BerkeAras3 个回答
0 个反应

:创建响应式网站

你好, 有可能创建响应式网站吗?例如:文本在移动设备上应较小,桌面端应更大。我该怎么做?

artf

是的,你必须更换设备 ![Schermata 2020-06-17 alle 01 42 22](https://user-images.githubusercontent.com/11614725/84838850-cf8e7400-b03b-11ea-8549-a661bd13257b.png)

BerkeAras

但这并不会让网站变得响应式。我的意思是,难道不能直接在手机上把文字做成15像素,在桌面端做成20像素吗?

artf

当你在不同视图中编辑时,这些更改只保存给当前设备

#28292020年6月14日作者 gpmonch2 个回答
0 个反应

“已检查”特质不会被更新

当通过 html 导入更新带有“勾选”特征的组件复选框时,它不会更新特征输入,比如:在grapes.js演示中的导入 html 选项中,在演示表单的“男性”复选框中添加勾选=“勾选”属性,结果是表单上的勾选框被勾选,但“勾选”特征却没有。

artf

感谢@gpmonch报告,但这只是网页预设的问题,它使用的是旧版表单插件。 这里你可以看到一个工作示例 https://jsfiddle.net/bp5e9zkc/

gpmonch

感谢你的快速回复!

#28282020年6月12日作者 kuhelbeher3 个回答
0 个反应

链接与CKEditor的问题

链接和CKEditor存在问题。我启用了标签的可编辑属性<a>: “JavaScript CKEDITOR.dtd.$editable.a = 1; ``` 当我双击链接时,它可以编辑,一切正常。但当我完成编辑并再次尝试编辑时,我却做不到。 ![simplescreenrecorder-2020-06-12_17 50 01](https://user-images.githubusercontent.com/37115006/84516172-16940680-acd6-11ea-94cd-b8e37bd1baf1.gif) 你能帮忙吗?

artf

请制作一个可复现的演示

kuhelbeher

@artf 就是这样:https://codesandbox.io/s/link-ckeditor-8md7v?file=/src/index.js

artf

我看到内容编辑内容仍然是“虚假”的,这也是bug的原因,但我不确定原因是什么。也有可能是CKEditor阻止了传播。 如果有人愿意帮忙,我会非常感激。

#28272020年6月12日作者 AndiswamyDev1 个回答
0 个反应

运行“editor.getSelected().view.disableEditing()”命令后,文本无法编辑吗?有没有什么替代命令可以变成可编辑的文本?

你好@artf, 我目前正在定制链接属性,所以在流程中,我需要限制所选文本变得不可编辑(以获得文本组件的精确列表),这样我就无法执行后续的RTE操作(取消链接)。我按照我们之前的Grapesjs指南和文档参考了链接、编辑器等内容。但我无法像用disableEditing那样,再次用编辑器命令让文本可编辑? 这是我的代码段, “''js linkRTEAction.result = 函数 (rte) { 插入带有特定href值的链接,以便我们以后查找 rte.exec('createLink', 'new'); editor.getSelected().view.disableEditing(); rte.exec(“unlink”...

artf

只需使用“editable”属性(例如“editor.getSelected().set('editable', false)”)

#28262020年6月12日作者 tonypartridge2 个回答
1 个反应

自定义选择列表到文本组件?

大家好。 我以前见过这种情况,但现在怎么也找不到了。基本上,在文本组件上,我们有顶部的栏: https://gyazo.com/754513edcebbb0566f18e384d3eba453 例如,我们如何在这里插入一个选择列表: 名称 电子邮件 电话 插入内容:{{NAME}} {{EMAIL}} {{PHONE}} 它基本上是一个短代码选择器?

RJCAM

你好@tonypartridge这里有一个示例代码可以实现这一点 你可以在文档中查看更多细节: [https://grapesjs.com/docs/api/richtexteditor.html#add](网址)

artf

@tonypartridge你说的可能是这个 https://github.com/artf/grapesjs/issues/481#issuecomment-342282125

#28252020年6月11日作者 Leozinho03 个回答
2 个反应

使用组件时,我该如何添加我的类CSS文件?

我有这个组件: 编辑。BlockManager.add('rodape', { 唱片公司:'3 Colunas', 内容:{ 标签名称:“div”, 可拖拽:确实, 属性:{ 类: 'row' }, 风格:{ '展示':“flex”, 'justify-content': 'flex-start', '对齐物品':'拉伸', 'flex-wrap': 'nowrap', “填充”:“10像素”, }, 内容:《拉拉》 } }); 我想使用类 ROW,但我该在哪里定义这个类? 当我把这个组件块拖入画布时,类的CSS甚至都没有加载。

RJCAM

嗨,@Leozinho0 你可以这样做:

RJCAM

其实,我给你的代码是有效的,想明白我的意思,试试这个:把自定义组件放到 Canvas 里,正如你说的,它不会加载 css 的“.row” 风格现在在画布中放置任意一列块,你会看到“.row” CSS 已被加载。 这是因为样式在块内部,只有在你把列块放入画布时才会渲染出来。 你可以在控制台打印时检查组件的HTML和CSS是否像我第一条评论里给你的代码那样制作。 “编辑。BlockManager.get(“column3”).attributes.content'

Leozinho0

嗨。谢谢你的回答。 但这根本没用。 如果你在添加组件(例如:3列)时点击 https://grapesjs.com/demo.html 并导出html,你会看到它加载了.row和.cell类。

#28242020年6月11日作者 tonypartridge3 个回答
0 个反应

拖曳物品在初始拖拽时位置不定?

所以当我把组件/物品从条子拖到中心时,它不会去我指定的位置......它总是偏向一侧大约20%的页面宽度?加装后可以调节。看看这个动图: https://gyazo.com/87076de55a1853e80b5dd7ea14ccb94e 有人有什么建议吗?

RJCAM

嗨@tonypartridge 你有最后一个GrapesJS版本吗? 用“dragMode: ”absolute“这个功能对我来说运行得很好, 请查看下面的基本代码:

artf

是的......实际上,当启用更小的设备视图时,我也能重现同样的问题,可能是某种回归。我需要时间调查,但目前我有点忙于其他事情,拖拽模式不是我的优先事项。所以,我希望有人能看看这个

soltanloo

我用绝对拖拽模式时也有同样的问题。积木总是从画布里掉出来,我需要滚动才能抓取并放回原来想要的位置。 @tonypartridge 你找到解决办法了吗?

#28232020年6月11日作者 Sameedkhan251 个回答
0 个反应

我用这种方法加载字体,Chrome上运行正常,但在Safari中显示原始字体列表

editor.on('load', function () { styleManager = 编辑器。风格经理; fontProperty = styleManager.getProperty('Typography', 'font-family'); 变量列表 = []; fontProperty.set('list', list); 列表 = [ fontProperty.addOption({value: “'Oswald', sans-serif”, name: 'Oswald'}), fontProperty.addOption({value: “Helvetica Neue, Helvetica, Arial, san...

artf

检查一下你的Safari是否显示缓存内容,并正确加载字体,我们这里已经讨论过同样的问题 https://github.com/artf/grapesjs/issues/2716

#28222020年6月11日作者 Lighost2 个回答
0 个反应

SVG在编辑器中不可见

你好, 我需要把 SVG 放进我的项目,所以我用自定义代码组件来实现这个目的。但当我把 svg 内容复制到 component 时,什么都没有显示。但当我查看生成索引时,SVG是可见的。我在演示编辑器里也试过同样的方法,但在编辑器和预览模式下都看不到。我用最新的 Safari 和最新版的 Google Chrome 测试过,当然我用的是最新版本的 GrapesJS(0.16.12)。 通缉的SVG来源是[这里](https://pastebin.com/35k7PFBG) 编辑器中的效果: ![](https://i.snipboard.io/gYPmI1.jpg) index.html中的样子(在我的页面中) ![](https...

RJCAM

你好@Lighost 我觉得问题出在那个SVG,因为只有这个不正常工作。 这可能包含一些自定义块本身未能正确理解的代码。 一个解决办法是本地保存 svg,然后用编辑器的默认图片块放出去,我测试过了,效果不错。 我也用很多不同的SVG测试过同样的问题,它们都正常工作。

Lighost

@RJCAM 是的,我知道,我已经做过了,比如插入 SVG 作为 img。但我真的需要把它作为 svg 对象插入——因为我需要用填充属性做一些悬停效果。无论如何,不知怎么的,它开始在编辑器中显示出来。我不知道我做了什么,因为我刚改了三次SVG类别填充,现在它们在编辑器里都能看到了。所以对我来说,我决定关闭这个问题,因为它已经解决😄了。

#28212020年6月10日作者 tonypartridge2 个回答
0 个反应

强制资产刷新?

你好, 当我们存储并加载 GrapeJS 时,它能很好地远程处理 JSON 🙌 格式 不过,它会加载现有的 A 资源,没有刷新新的资源。防止存储资产或强制资产刷新的最佳方法是什么?

artf

能发一下你的代码吗?

no-response[bot]

由于我们请求原作者提供更多信息未获回应,本期已自动关闭。仅凭当前期刊中的信息,我们没有足够的信息采取行动。如果您有答案或找到我们需要的答案,请随时联系我们,以便我们进一步调查。

浏览所有主题