GrapesJS 问题

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

找到 3,464 个问题

#14322018年9月17日作者 JulyanoF3 个回答
2 个反应

自定义 DomComponent 和 Block 允许所有元素复制

我创建了一个自定义块: 以及一个自定义主导组件: 还有一个自定义命令(我找到了出错的地方): 当我为子 img 设置新链接时,我添加到编辑器中的任何块都会被添加两次,当我选择这个重复的块时,两个块都会被选中并更改: ![图片](https://user-images.githubusercontent.com/17284704/45626636-5f1d8200-ba66-11e8-971a-19bb5c9d4a9e.png)

artf

@JulyanoF你绝不应该做这个“编辑”。如果你觉得需要这个函数,DomComponents.render()',很可能是你操作错了...... 那么在你的自定义组件中,你不需要设置“isComponent”方法,所以请查看这份指南:https://grapesjs.com/docs/modules/Components.html 其余内容请提供现场演示

artf

我正在尝试获取选定元素的 html(editor.getSelected().toHTML()),对它进行操作并更改原始内容 这不对...... 你应该用[组件的API](https://grapesjs.com/docs/api/component.html),不要碰视图,更别碰它的HTML。如果你不理解这个概念(你应该编辑组件的模型,而不是视图),你会遇到很多问题

JulyanoF

@artf你说得对。问题在于使用“render()”函数,也就是复制元素......但是,如果我移除这个功能,编辑器的HTML并没有改变......它仍然显示旧内容,而不是新的内容。我该如何避免这种情况?我会提供现场演示

#14312018年9月17日作者 mrajeshkrossark3 个回答
3 个反应

从远程加载HTML文件

我把我的HTML内容托管在云端。然后在编辑器中尝试加载html内容时,我发现错误:“对预检请求的响应未通过访问控制检查:请求资源上没有'访问-控制-允许-起源'头部。因此,原点“http://localhost:3000”不被允许访问。如果不透明度响应符合你的需求,将请求模式设置为'no-cors',以便在禁用CORS的情况下获取资源。” 我的代码:const editor = () = > grapesjs.init({ 容器:“#editor-传送门”, 画布:{ 斯泰尔斯:[“https://codepen.io/mrajeshkrossark/pen/mGLyJX.css”] }, 插件: ['GJS-preset-web...

cjpollard

你是在指向一个网站。 你需要能够处理这些请求的端点。https://grapesjs.com/docs/modules/Storage.html#setup-remote-storage

JulyanoF

> 你正在指向一个网站。你需要能够处理这些请求的端点。https://grapesjs.com/docs/modules/Storage.html#setup-remote-storage我用下面的端点尝试过,结果也显示错误storageManager: {类型:“远程”,storeHtml: true,storeCss: true,contentTypeHTML: true,urlStore:“http://www.lightblue.byethost4.com/inde...

mrajeshkrossark

你正在指向一个网站。你需要能够处理这些请求的端点。https://grapesjs.com/docs/modules/Storage.html#setup-remote-storage 我尝试了以下端点,也显示错误 storageManager: { 类型:“远程”, storeHtml: true, storeCss: true, contentTypeHTML: true, urlStore:“http://www.lightblue.byethost4.com/ind...

#14292018年9月15日作者 iainheng3 个回答
2 个反应

如果组件数组不是空的,从远程存储加载时内容为空

当“JSON”包含非空的“gjs-components”时,我在加载存储的远程内容到编辑器时遇到了问题 我的JSON数据看起来像这样,是非常基础的块引号和一句文字 ![图片](https://user-images.githubusercontent.com/3263759/45588987-5b97d700-b950-11e8-9568-73fda5ca19cb.png) 呼叫远程终端时的示例响应 ![图片](https://user-images.githubusercontent.com/3263759/45589049-728af900-b951-11e8-9fc0-d8f1d55d1c31.png) 如果我设置 'gjs...

artf

实际上可能有个bug,你能不能尝试把“gjs-components”作为字符串返回(所以试着用json编码你的数组)

artf

谢谢@iainheng,暂时保持这样,直到下次发布(希望下周能推迟)

iainheng

@artf 谢谢你的帮助。😊 这确实是个bug。我把“gjs-components”存成字符串,现在能正常工作了。🎉 这和字符串是同一个数据存储 ![图片](https://user-images.githubusercontent.com/3263759/45592738-3a62d500-b9a8-11e8-9a53-5fbb912a9f68.png)

#14282018年9月15日作者 peakrams3 个回答
5 个反应

定义或隐藏特定组件的属性

你好, 我想知道是否有可能为特定组件定义属性。我的意思是,当我选择组件“图片”时,我希望在样式管理器面板中,相对于“排版”的部分不显示;同样地,当我选择“表格”组件时,我希望在样式管理器的“维度”面板中看到一个属性“我的属性”,我希望它只适用于“表格”组件。这可能吗? 谢谢!

juanj

我不确定这是不是最优方法,但你可以听“component:selected”事件,如果选中的组件是你想要的,就可以添加一个新扇区。然后你需要听取“component:deselect”事件,如果取消选中的组件就是你移除多余扇区之前的那个。 如果你不想创建整个扇区,可以直接用“addProperty”和“removeProperty”来覆盖现有扇区。 同样的操作也可以用来移除特定组件的扇区。

artf

实际上,你也可以依赖一些专门为此目的制作的[Component](https://grapesjs.com/docs/api/component.html)属性:'可样式化' - 如果组件可以样式化,则为真。你也可以指定一组CSS属性,可以样式化,比如:['color', 'width'],其他所有属性都会被样式管理器隐藏。默认值:“真”“不可样式化”——表示一组样式属性,这些属性应对样式管理器隐藏。默认值:“[]''styleable-require' - 表示样式管理器...

artf

@peakrams警告确实存在,但Github的Markdown不允许你应用自定义样式来提高可见度 ̄\\(ツ)\/ ̄ ![Schermata 2018-09-16 全部 18 41 39](https://user-images.githubusercontent.com/11614725/45598697-7dd93580-b9e0-11e8-8285-e07488273818.png)

#14272018年9月15日作者 chiqui3d3 个回答
2 个反应

有些段落不能标记,也不能悬停

我正在用 Flex 在某个模板上用 Boostrap 4 测试编辑器,但我发现有些段落没有正确显示徽章,我打算放这里演示 [https://jsfiddle.net/kf5n9sdq/31/](https://jsfiddle.net/kf5n9sdq/31/),我给自己设定如果删除主图可以选择,但我不太明白会发生什么, 因为我需要的图片放在原位,我也尝试修改样式,并且一直在做同样的调整。 啊,我说的那些段落都是在主图之后的。

juanj

看起来和卷轴有关。如果你往下滚动,蓝色的选择框会显示段落开头的位置。我觉得这和图片没关系。即使你删除图片并滚动,结果还是一样。

chiqui3d

观察得真好,伙计,问题出在溢出的身体上:隐藏; 非常感谢@juanj

lock[bot]

由于关闭后没有近期活动,该帖子已被自动锁定。请为相关漏洞开启新一期。

#14262018年9月14日作者 YashPrince2 个回答
0 个反应

让某些元素默认无法编辑。

@artf我们如何设置配置,使得在导入 HTML 时,编辑器中不会将某个元素视为文本组件,而是应视为父文本的内部文本。 例如。<p> 这里有一些示例文本。<span> 不要把它做成文本组件 </span>示例文本2 </p>' 我不想把span做成文本组件,因为P已经可以编辑了。我无法将data-js-editable设为false。因为它必须 多处更新。所以我想知道有没有办法把那个类似span的元素放进去 无法转换为文本组件。 谢谢!

artf

[延伸](https://grapesjs.com/docs/modules/Components.html#update-component-type)“text”组件类型,并在“isComponent”中实现你的逻辑。如果元素符合你的条件(你可能会检查内元素),只需以这种方式返回对象 “''js isComponent(el) { // ... 如果(isWhatYouNeed) { 返回 { 类型:“文本”, 内容:el.innerHTML, 组成部分:[], 通过添...

lock[bot]

由于关闭后没有近期活动,该帖子已被自动锁定。请为相关漏洞开启新一期。

#14252018年9月14日作者 YashPrince2 个回答
0 个反应

属性:元素的验证

@Arif 如何验证葡萄元素的属性,比如背景色 我们提供了手动输入背景和颜色选择器的选项。如果用户 没有添加有效的CSS,所以样式中断和预览页面也无法正常工作。 任何帮助都将不胜感激。 ![错误1](https://user-images.githubusercontent.com/40828744/45547093-32d2ed00-b83d-11e8-8516-7994ff9321ec.png) ![错误2](https://user-images.githubusercontent.com/40828744/45547094-34041a00-b83d-11e8-8847-00abf5e563cc.png) ![错误3](h...

artf

虽然没有内置功能,但请记住,一旦你渲染了样式管理器,所有元素即使不可见,也仍然可以通过DOM访问,所以你可以在渲染后添加验证逻辑

lock[bot]

由于关闭后没有近期活动,该帖子已被自动锁定。请为相关漏洞开启新一期。

#14242018年9月14日作者 mararn16183 个回答
0 个反应

复选框特性值在视图(render())和模型(getHtml())中渲染方式不同

我有一个自定义组件,带有复选框特性“show-name”。当特征值为“true”时,组件在视图中渲染为 show-name=“true”属性,而模型只有“show-name”,并通过 getHtml() 将渲染为“show-name”。 我怎样才能通过getHtml()让一个复选框特征渲染成“show-name=true”? (抱歉下面引用代码比较长 ;-) )View 属性为 show-name=“true” '<filter-wizard data-gjs-type=“Feature (Enum)” filter-model=“filterDAO.getFilterForPropertyProfileId(46)” pp-id...

artf

@mararn1618你能制作一个可重复的现场演示吗?

mararn1618

当然,@artf你好。我已经提取了项目中相关的部分,并制作了一个演示和复刻步骤:演示:https://www.secretbakery.io/grapesjs/issue1424.html列表演示文件:https://www.secretbakery.io/grapesjs/ 谢谢你的照顾! 编辑:我已经在文件里添加了演示的可下载归档(grapesjs1424.zip)。

mararn1618

我现在正在用一个变通方法,让我的 AngularJS 指令——该属性的使用点——重新计算“show-name”,就像我们在链接阶段有 “show-name=”true“一样。绕过 AngularJS 指令

#14232018年9月13日作者 jvillena2 个回答
0 个反应

面包屑

你好,@artf, 现在我正在制作一个类似LayerManager的面包屑,但我想知道是否有方法可以让它在我覆盖面包屑项时,像你在LayerManager上做的那样,让它将dom元素悬停在上面。 谢谢

artf

每个组件都有“status”属性,所以在面包屑视图中你可以听到每个组件模型的“change:status”。看看它在[ComponentView](https://github.com/artf/grapesjs/blob/dev/src/dom_components/view/ComponentView.js#L102)中实现的,并且在这里的图层[ItemView](https://github.com/artf/grapesjs/blob/dev/src/navigat...

lock[bot]

由于关闭后没有近期活动,该帖子已被自动锁定。请为相关漏洞开启新一期。

#14222018年9月13日作者 FrciSmrci2 个回答
1 个反应

无单位的财产滑块

嗨,@artf, 正如之前提到的,关闭的[ticket](https://github.com/artf/grapesjs/issues/1391) => 我认为这个特定的[增强](https://github.com/artf/grapesjs/commit/d29274f0afd95bdb13f80b6598c7a16ed11b5e4e)破坏了无单位属性的行为,比如不透明度。滑块在这种情况下表现得很奇怪,即使在[GrapesJS演示](https://grapesjs.com/demo.html)中也是如此。 提前感谢大家。

artf

你说得对,我觉得我应该用“parseFloat”,下一个版本会修正

lock[bot]

由于关闭后没有近期活动,该帖子已被自动锁定。请为相关漏洞开启新一期。

浏览所有主题