GrapesJS 问题

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

找到 545 个问题

🔍 typescript
#32302021年1月13日作者 alivex3 个回答
0 个反应

Modal 关闭后动态关闭后不会打开

你好; 谢谢大家提供这么棒的工具,我真的很喜欢文档,使用起来很简单。 我觉得我遇到了第一次动态关闭模态后再也打不开的问题。 示例:

artf

我无法在官方演示中复现,比如说。 “''js editor.on('modal:open', () => { console.log(“模态开启”); setTimeout(() => { console.log(“闭调式”); 编辑。Modal.close() }, 2000) }); ``` 但根据你的代码,我觉得它没打开是因为你在打开后(刚触发开启)就立刻关闭了,难道我漏掉了什么?!

no-response[bot]

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

ClaudeCode

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

#32282021年1月12日作者 Abhisheknanda13444631 个回答
0 个反应

组件价值没有变化

你好@artf 我添加了一个新组件 这是代码 “''js 编辑。DomComponents.addType('header', { 型号:{ 默认值:{ 标签名称:'h1', 类型:“头部”, 尺寸:“H1”, 特质:[ { 名称:“尺寸”, 标签:“尺寸”, 类型:“选择”, 变革提案:1, 选项:[ {值:'h1',名称:'One'}, {值:“h2”,名称:“二”}, {值:'h3',名称:'三'}, ] } ], 内容:“请在此插入你的头文字” }, init(){ this.listenTo(this, 'change:size', this.更新头); }, Updatehead(){ var newElem = $(...

ClaudeCode

谢谢你举报,@Abhisheknanda1344463。 关于组件价值没有变化的好问题。ProseMirror 推荐的方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('somethi...

#32252021年1月9日作者 Abhisheknanda13444632 个回答
0 个反应

如何从复选框特性中更新风格?

你好@artf 我尝试用复选框特性更新样式,但它没有调用函数。 这是代码 非常感谢你能提供的任何见解! 谢谢

Abhisheknanda1344463

@artf 搞定了,傻乎乎的——错误 移动模型中的初始化函数。 结案

ClaudeCode

谢谢你举报,@Abhisheknanda1344463。 关于如何从复选框特性更新样式?的好问题。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('...

#32242021年1月8日作者 marcepoblet3 个回答
1 个反应

当对任何文本组件应用变更时,changesCount 不会被递增

https://user-images.githubusercontent.com/64096863/104047608-af352b00-51c0-11eb-8261-1d7ae9277d25.mp4 当你双击任何文本组件并进行写入或修改时,参数“changesCount”不会被递增。 对于按钮/图片组件,参数“changesCount”是递增的,且工作正常。 我附上了一个视频,展示了这种行为。 我在 0.16.27、0.16.30 和 0.16.34 版本中都能重现这个错误。在旧版本中,这个问题不会出现

artf

谢谢@marcepoblet修复已经准备好下一次发布了

marcepoblet

谢谢@marcepoblet修复已经准备好,下次发布时会有修复 谢谢!@artf,你对上映日期有个估计吗?

ClaudeCode

谢谢你举报,@marcepoblet。 changesCount 没有递增的问题,当应用到任何文本组件时,似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox...

#32232021年1月7日作者 ianef3 个回答
2 个反应

专长:从一个URL创建画布

我一直在玩 GrapesJS,并尝试把它集成到 Symfony 5 的项目中。特别是,我希望能够在编辑器中编辑基于Bootstrap 4和其他组件(如FontAwesome Pro)的模板,以及基于这些的自定义块。 我用Symfony的Webpack-Encore捆绑包来生成应用程序的脚本和样式文件,这让当前的iframe画布系统用同样的版本化组件(如Bootstrap等)工作非常头疼。 目前我只能通过初始化配置向画布注入样式和脚本URL,比如这样: 问题是我想保留与主应用中包含组件版本完全相同的版本。如果我升级这些,我希望它能反映在画布使用的组件中,这可能还包括自定义代码和样式。 在 SymFony 和其他主要框架中,链接根资源...

ianef

真是太遗憾了。我没说要从其他网站取用,我想做的是保持和项目其他部分的一致性。 算了,我还是继续找别的地方,找一个能更好地整合当前大型应用构建方式的编辑器。Webpack 和其他转译器确实是大型项目的领先选择,即使是小项目也有好处。

artf

嗨 Ian,如果你需要从 URL 加载 HTML 内容,我只能建议在服务器端获取并用该内容初始化编辑器(在浏览器中加载外部资源通常会遇到跨源问题),所以就浏览器的工作原理来说,我看不出添加这种功能的合理性。

ClaudeCode

谢谢你举报,@ianef。 关于FEAT:从URL创建画布的建议很棒!虽然这个具体功能还没有出现在核心 API 中,但有几种方法可以实现类似的行为。 使用事件系统: “JavaScript editor.on('component:update', (component) => { 你的逻辑 }); ``` 替代方法: 听取“selector:add”以获取CSS选择器更改 使用“selector:custom”来表示自定义规则 利用“change:*”事件进行细致跟踪 构...

#32182021年1月5日作者 bgrand-ch4 个回答
2 个反应

如何添加带有内联样式的新HTML元素?

我想在“rte.selection()”周围添加一个带有内联样式的新HTML元素。 以下面的例子来说,HTML还可以,但JSON部分可能不太行: “''js const editorRte = this.editor.RichTextEditor // ... editorRte.add('fontSize', { 图标:” <select> <option value=“” 已禁用 已选中>Size</option> <option value=“8px”>8 pixels</option> <option value=“12px”>12像素</option> <option value=“16px”>16像素</option>...

artf

@bgrand-ch,你说的“可能”是什么意思?😅

bgrand-ch

@artf感谢你的快速回复🙂,更新到“0.16.30”后我的问题就解决了。 🎉

bgrand-ch

https://github.com/artf/grapesjs/issues/3069 🤔

#32162021年1月5日作者 tomhatzer4 个回答
2 个反应

功能:通过资产管理器添加 referrerPolicy 以加载图片

你想给GrapesJS添加什么? 我正在尝试通过资产管理器为图片加载添加“Referer”头。 详细描述你的功能需求详细 我正在开发一个托管在AWS上的页面构建器。为了防止别人热链接我的图片,我实现了AWS WAF,限制图片加载到referer域(我自己的域名)。 当用“.src”程序加载图像时,没有发送referer头,导致图像损坏或无法显示(服务器出现403个错误)。我们可以通过将“refererPolicy”属性设置为“origin”来解决这个问题。更多详情请见此处:https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/referrerPolicy...

artf

正如对PR的回复,如果需要,可以扩展图像组件来实现,而不会破坏对他人的集成。 顺便说一句,当你想添加某个功能时,你应该始终考虑这对他人的使用方式。所以,如果“referrerPolicy”功能提供了更多选项,那么让它可自定义可能更合理,这样新功能也能适用于其他情况(你不能只强制它“origin”,因为它适合你的情况)。

tomhatzer

非常感谢你的建议@artf——我会尝试通过扩展原始组件来完成这件事。祝你有美好的一天!😃

tomhatzer

对于所有遇到iframe无法发送里面内容引用头的人,这里有一个快速且粗略的解决方案。 只需将Canvas iFrame的“src”设置为你想要的域名,并用这个引用器。就我而言,我希望和编辑器显示的网页用的是相同的域名。 在渲染时,'srcDoc' 属性会引路,然后是 'src' 属性。 请注意,在Canvas iFrame加载后设置可能会导致错误,所以可以尝试操作Canvas视图的属性(据我所知,这不直接实现)。

#32152021年1月4日作者 san-1232 个回答
0 个反应

来自远程数据库的内容加载问题

你好, 我创建了Grapejs页面构建器。我有两个链接,一个是 pagebuilder1,另一个是 PAgeBuilder2。两者都被重定向到grpaejs编辑器,并根据ID从数据库加载内容。 当我点击PageBuilder1时,会变成index.html?id=1(从数据库加载已保存内容) 当我点击PageBuilder2时,会显示index.html?id=2(从数据库加载已保存内容) 我的问题是所有页面构建器都加载了同样的内容。 我的代码: Grapesjs.init({ 展示偏移集:1, noticeOnUnload: 0, 容器:“#gjs”, 身高:“100%”, fromElement: true, storageM...

artf

请按照本指南 https://grapesjs.com/docs/modules/Storage.html#setup-remote-storage

ClaudeCode

感谢你报告,@san-123。 关于远程数据库内容加载问题的建议很棒!虽然这个具体功能还没有出现在核心 API 中,但有几种方法可以实现类似的行为。 使用事件系统: “JavaScript editor.on('component:update', (component) => { 你的逻辑 }); ``` 替代方法: 听取“selector:add”以获取CSS选择器更改 使用“selector:custom”来表示自定义规则 利用“change:*”事件进行细致跟踪 构...

#32132020年12月30日作者 theSC0RP4 个回答
5 个反应

如何保存动态添加的特性

你好,@artf,我有一个自定义组件,带有按钮特性。当按下按钮时,我会用“comp.addTrait()”动态添加自定义特质。 当我加载已保存的模板时,我希望容器也能显示动态添加的特征。(我用组件加载模板,但动态添加的特征没有显示出来。)我可能哪里做错了?

artf

我通过在组件上加一个计数属性,然后在容器的初始化中添加特征计数时间来实现。 这才是正确的方法。 特征会被故意跳过 JSON,否则你会暂停存储中的组件定义(例如,当你用新特征升级组件时,用户仍会看到旧的特征)

theSC0RP

@artf,谢谢你的回复。这是一条非常宝贵的信息。

theSC0RP

我通过在组件上加一个计数属性,然后在容器的初始化中添加特征计数时间来实现。

#32122020年12月30日作者 Abhisheknanda13444632 个回答
0 个反应

Lightbox 组件

你好@artf 我正在尝试制作一个组件光箱,和Grape Drop一样。 我无法更新图片的原始字符 你能帮我一下吗 这是我目前写的代码 灯箱块 组件- :

artf

请检查[图像组件](https://github.com/artf/grapesjs/blob/dev/src/dom_components/view/ComponentImageView.js)

ClaudeCode

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

浏览所有主题