GrapesJS 问题

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

找到 1,399 个问题

🔍 outdated
#9212018年3月2日作者 dmmprog3 个回答
1 个反应

从面板按钮中选择并聚焦一个HTML元素

大家好, 有没有可能用Grapes在某个section的html里设置焦点,比如作为锚点?我有一个面板按钮,它只是选择我想要的部分,但不会聚焦到元素。这是代码: panel.addButton('options', [{ 编号:“链接”, 班级名称:“fa fa-th-list”, 命令: 函数 linkChap(e) { 编辑。DomComponents.getWrapper().find('section').forEach(model => { const current = model.getAttributes()['id'] ||''; if(current == “chap10”){ editor.select(mo...

artf

如果你说的“焦点”是指将视图滚动到组件,遗憾的是没有这种方法,但你实际上可以通过依赖“编辑器”来实现。画布.getBody().scrollTop'

Amir2828

你成功做到了吗?

lock[bot]

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

#9192018年3月2日作者 AlessandroMagri2 个回答
0 个反应

Reinit GrapesJS

大家好, 我正在编写一个应用程序,包含 grapesjs 在某个特定 div 中的 ajax 调用。 显然,我会用外部菜单来在应用里导航。 如果我重新打开发起 grapesjs firefox 的页面,会给我一个错误:“TypeError: this.frame.el.contentDocument is null”。 希望我已经解释清楚了。 有没有什么办法可以做到? (我看过#849、#889和#914,但找不到解决方案)

artf

订阅#914,可能会在下次版本中修复这个问题

lock[bot]

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

#9182018年3月1日作者 lorrandavid2 个回答
0 个反应

如何更改性状标签?

找了一阵子,我没找到只更改特质标签而不覆盖所有内容的方法。 这是我尝试失败的尝试 我看到有人覆盖整个模块,这应该是正确的做法吗? ![特质](https://user-images.githubusercontent.com/17368070/36861194-fe3248c8-1d61-11e8-9bb7-757d36974a04.png)

artf

目前,要更改特征标签,必须在组件层面操作 “''js 组件模型 默认值:{ ..., 特质:[...] } ```

lock[bot]

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

#9172018年3月1日作者 chthomos2 个回答
0 个反应

每个元素的自定义样式属性

有可能为每个元素设置自定义样式属性UI吗? 举个例子,我想让字体大小显示为文本组件的文本框,而自定义组件的无线电显示。 字体大小属性可以在同一扇区内。 如何实现这一目标?

artf

是的,我用同样的方法做了柔性网格。 在你的样式管理器配置中,这样创建属性 “''js 性质:[ ... { ID:“font-size-radio”, 类型:“无线电”, 名称:“字体大小(无线电)”, 属性:“font-size”, 选项:[{...}, {...}], 有了这个选项,专利权就会被隐藏 直到有人不再需要它为止 toRequire:true, }, ... ]

lock[bot]

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

#9162018年3月1日作者 tommedema3 个回答
1 个反应

为什么图层没有元素标签名称?

我正在尝试葡萄内部结构,因为我希望将来能有所贡献。我主要关注的是用通用的HTML网站来做值得,无论CSS和HTML的风格和结构如何(包括文档类型、正文支持等)。 我原本以为“图层”层级会代表DOM树。虽然目前看起来没错,但元素的命名似乎不太对劲。例如,用这个 HTML 表示: <img width=“392” alt=“截图 2018-03-01 11 27 28” src=“https://user-images.githubusercontent.com/331833/36839889-902ba6da-1d43-11e8-8dd3-db4f832fc34a.png”> 会这样显示: <img width=“254” alt=...

maxtacco

顺便说一下,看起来图层管理器在 https://github.com/artf/grapesjs/blob/49100b2f63411fb08d438d21a5f7ff9131773a75/src/navigator/view/ItemView.js#L28 中渲染树节点时使用了组件的 https://github.com/artf/grapesjs/blob/49100b2f63411fb08d438d21a5f7ff9131773a75/src/dom_componen...

maxtacco

GrapesJS 是基于组件的。所以,我认为在这种情况下它显示的是组件名称,而不是标签名称。我觉得添加标签名称和/或自定义图层树渲染会是个不错的改进。

maxtacco

实际上,GrapesJS 组件可能包含多个 DOM 元素,因此在这种情况下显示标签名称可能不合理,因为你是为组件做样式,而不是单个元素。

#9142018年2月28日作者 nojacko3 个回答
3 个反应

:葡萄不能用新的HTML重新激活

更改HTML后在Grapes上调用“init()”失败。这种情况发生在单页应用上。 我认为需要一个“destory()”函数来优雅地重置葡萄。https://jsfiddle.net/wdtrg1je/(非常基础的单页应用模拟)点击“添加葡萄”(加载带有某种HTML的葡萄)点击“链接”,将其href改为“http://yahoo.com”点击“移除葡萄”。它会从Grapes获取HTML内容,然后再去掉Grapes元素。再次点击“添加葡萄”。这又开始了Grapes,使用了与原HTML不同的新HTML。控制台错误。 ![截图 2018-02-28 14 54 20](https://user-images.githubusercont...

nojacko

看来我不是唯一一个想要这个的人😉。单页应用才是这点的价值所在(这是我提出的问题,但也能释放一些内存)。 等我有新东西时会争取个人代表。

artf

正如前面提到的(https://github.com/artf/grapesjs/issues/849#issuecomment-364279629),目前我觉得启动这样的功能(创建一个好的摧毁方法)没有什么价值,但非常希望看到一些公关的进展:)

lock[bot]

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

#9122018年2月28日作者 nojacko3 个回答
2 个反应

:HTML 属性/特征未逃逸

当属性加上双引号时,会导致 HTML 变质。https://jsfiddle.net/szLp8h4n/拖入链接块。点击编辑器中的链接进入“组件设置”面板在“title”栏输入“这是”示例“。点击查看代码图标。生成无效的HTML '''html <div class=“c318”>Hello World!!</div> <a title=“这是一个”示例“” class=“c739”>链接</a> ```

artf

谢谢你接住我,詹姆斯 欢迎永久居民

artf

@nojacko我不会在发布前构建文件,所以如果你用的是“dist”里的文件,你还是用旧的

artf

由 https://github.com/artf/grapesjs/pull/939 修复

#9112018年2月28日作者 rajatkumcom3 个回答
0 个反应

有人能帮我解决自定义加载吗?

我可以用什么代替跟随—— editor.setHtml( arrdata['html'] ), editor.setCss( arrdata['css']), 请用下面的代码。

rajatkumcom

以下是我的代码: “''js 编辑。Commands.add( 'load-command', { run(编辑,发送者) { editor.load(() => { sender.set('active', 0); }); var arrhtmldata = {}; arrhtmldata['nid'] = 65; arrhtmldata['contenttype'] = “”“; arrhtmldata['op'] = “loadContent”; $.Ajax({ U...

artf

只是别用它们来加载模板数据 “''js editor.setStyle( arrdata['style']), editor.setComponents( arrdata['components'] ); ``` 这就是你需要的全部

rajatkumcom

谢谢......

#9102018年2月28日作者 tommedema3 个回答
1 个反应

:支持没有预定义CSS结构的现有HTML页面的复杂度估计?

我有大量静态网站,有些是很久以前开发的(用Bootstrap等),有些是最近开发的(用CSS Grid等)。有些使用内联样式,有些使用基于类的样式,有些基于组件层级(例如“#id > div > ul > li”),有些则直接通过 html 组件名样式(例如 'form'),还有些则结合这些元素。 我相信 Grapes 只支持类似 BEM 的 CSS 样式。也就是说,每个组件都有自己的类。这是正确的吗? 此外,这些静态站点中有些依赖于大型CSS库,比如Bootstrap,我想把它们传递到'grapes.init'的'style'属性里。实现这一点会非常有挑战性吗? 我要内置支持任意CSS样式会有多复杂?这需要彻底改造吗?还是说其实...

tommedema

@artf谢谢,我明白了。我其实很喜欢你依赖浏览器的CSS解析器,因为我已经注意到大模板的性能问题了。如果你还依赖Postcss,我担心性能可能会进一步下降。 我目前正在用各种模板测试葡萄。我会整理一份关于小提琴的问题清单。 大多数渲染问题源于文档类型未被应用,但也有一些其他问题。有些功能问题,比如如果你复制了一个组件,然后更改它的样式,原组件的样式也会被调整。这似乎是因为 Grapes 是调整原始类,而不是针对你选择的组件内联编辑样式。 我也希望自己能有所贡献,所以首要目...

artf

我相信 Grapes 只支持类似 BEM 的 CSS 样式。也就是说,每个组件都有自己的类。这是正确的吗? 是“选择器/类查看器”,只能让你编辑基于类的选择器的样式,比如“.class1” “.class1.class2”,但GrapesJS应该能顺利导入你所有的规则此外,有些静态站点依赖于像 Bootstrap 这样的大型 CSS 库,我想把这些库传递到 grapes.init 的 style 属性中。实现这一点会非常有挑战性吗? 你可以用这种方式加载外部内容 “''js...

tommedema

@artf 谢谢你的回答!我觉得我可能需要详细解释一下我的使用场景。 并不总是指望导入模板的人能定义来自外部库的CSS。原因在于CSS通常会被编译并压缩成一个捆绑包。因此,引导规则等将与该HTML页面的规则合并。因此无法定义哪些文件应该单独导入。 我说的任意CSS样式是指用CSS选择器为HTML元素做样式的不同方式集合(类、原生HTML元素与内联等)。 到目前为止,我注意到我当前模板在 Grapes 编辑器中渲染错误的三个原因:模板的文档类型被忽略;HTML4 模板的渲染方...

#9092018年2月28日作者 konstantin550003 个回答
0 个反应

事件不是在画布上拖放的。

大家好。 问题是: 事件在拖延(进入)画布后,就不再火了。 editor.on('canvas:dragover') Editor.on('canvas:drop') Editor.on('canvas:Dragenter') editor.on('canvas:dragend') 代码就是仓库里的演示代码,加上这4个事件。 这是代码:var editor = grapesjs.init({显示 偏移量:1,noticeOnUnload: 0,容器:“#gjs”,高度:“100%”,fromElement: true,storageManager: { autoload: 0 },styleManager : {扇区:[{名:“将...

konstantin55000

代码就是语法。合理。 这里有代码的 jsfiddle https://jsfiddle.net/s9b2k7vp/ 这是演示: https://www.screencast.com/t/pWcpkM7QO

konstantin55000

更新。 事件正在触发,但就在块块掉落到画布之后。 我不确定这是不是个问题,因为 那Event canvas:dragend和canvas:dragover呢, 如果方块没有落入画布,它们就根本不会发射。 这是演示,请查看视频: https://www.screencast.com/t/9xHVwwp3C54J https://jsfiddle.net/s9b2k7vp/2/

konstantin55000

非常抱歉。事件不是火灾,因为事实并非如此grapes.js 感谢大家的关注。

浏览所有主题