#31262020年11月9日作者 mohd74694 个回答
点击上传按钮时侧面预览正常，但点击那个视频预览时会报错，其他图片都无法正常工作，我需要在Canvas中显示视频，比如显示类似主体的图片 ![动图]（https://user-images.githubusercontent.com/12613564/98598005-a24ca600-22fb-11eb-867e-95dc66a6f5a5.gif） 这就是我正在做的 ![图片]（https://user-images.githubusercontent.com/12613564/98591110-96f47d00-22f1-11eb-9520-8c201f0b27d8.png） ![图片]（https://user-images....
mohd7469
@artf你能告诉我，我该如何上传和预览视频文件，而不是图片？
ZeroCoolHacker
@awais786327我上传不同资源时也很吃力。也许这能帮到你。 https://grapesjs.com/docs/modules/Assets.html#uploading-assets
ZeroCoolHacker
@awais786327我看过那个网站，似乎你需要在视频标签里加上'autoplay=“true”才能播放
#31252020年11月9日作者 fq-selbach3 个回答
版本：0.16.27 你能重现演示中的bug吗？ [x] 是的 [ ] 不 预期的行为是什么？ 通过样式管理器添加“background-image”时，显示为“background-image： url（...）;`. 目前的行为是什么？ 你会看到的不是“background-image：url（https://grapesjs.com/docs/logo.png）;”，而是“background-image：linear-gradient（https://grapesjs.com/docs/logo.png）;”。 详细描述那个漏洞 当一个元素具有给定的类别为“背景：线性梯度（...）'或'背景图像：线性渐变（...）;你试图...
johnkeel-thork
我正准备报告同样的问题。 新增背景图片： <img width=“847” alt=“截图 2021-12-23 12 06 51” src=“https://user-images.githubusercontent.com/26764290/147238562-8df3ea2a-aca7-4b08-9d64-73fd1495d699.png”> 它正在转换为线条渐变，而不是网址： <img width=“621” alt=“截图 2021-12-23 12 07 36”...
artf
关闭 [jsfiddle]（https://jsfiddle.net/cqr7Luaj/），问题似乎解决了
ClaudeCode
谢谢你举报，@fq-selbach。 *线性梯度CSS对背景图像产生奇怪影响的问题似乎是竞赛条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。 尝试什么： 添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤：** 如果还没测试过，请用最新的GrapesJS版本测试 提供最小可重复的示例（CodeSandbox）——这有助于团队更...
#31242020年11月9日作者 archerbj3 个回答
你好，我正在尝试用视频组件在资产管理器中上传。我意识到我可以利用编辑器事件“component：selected”来实现这一点。 虽然能用，但并不完美。我更喜欢用双击触发资源管理器打开。 如果能有像“component：clicked/dbclicked”这样的事件，那就更好了
artf
你可以扩展视频组件，在其视图中添加类似[Image]（https://github.com/artf/grapesjs/blob/175151b69a041c5bcb3cd4b93bee4df8b2063103/src/dom_components/view/ComponentImageView.js#L8）中的事件。
addlistener
你@archerbj让它成功了？我试过了，ComponentView 似乎只导出了类型？ <img width=“883” alt=“image” src=“https://github.com/GrapesJS/grapesjs/assets/4531670/e075cf79-4e93-411a-ba35-63dd2fd0ad51”>
ClaudeCode
谢谢你举报，@archerbj。 感谢你分享关于FEAT： component：clicked / dbclicked event的报告。为了帮助团队调查并优先排序： 请提供： 一个最小可复现的例子（CodeSandbox/JSFiddle） 你的GrapesJS版本号 浏览器和操作系统信息 浏览器控制台的任何错误信息 重现问题的步骤 最有帮助的是什么： 简约代码示例（不是你整个项目） 屏幕录制或截图显示问题 明确区分预期行为与实际行为 你正在使用的GrapesJS配置 有...
#31232020年11月9日作者 fq-selbach4 个回答
你想给GrapesJS添加什么？ 显示风格“内联弹性”。 描述： 目前，样式管理器的显示选择器只有“flex”作为选项，但与“block”和“inline-block”一样，有“inline-flex”是有用的。 当我尝试用这个（破解？）手动添加时： 我能得到结果，但有很多由“flex”触发的条件运算符在“inline-flex”下不会触发，比如样式管理器的“Flex”部分不会出现。 最新版本有替代方案吗？ [ ] 是的（描述另一种情况） [x] 不 这是否与某个问题有关？ [ ] 是的（请提供本期链接） [x] 不
lexoyo
对于想找解决方案的人，我通过修改StyleManager选项是没做到的 所以[这是我做的]（https://github.com/silexlabs/silex-lib/blob/817174ef6ca9f9875c679748d5f017152ceaca0a/src/ts/client/grapesjs/flex.ts#L43） “''t” const sector = 编辑器。StyleManager.getSector（'flex'） sector.on（'chang...
artf
抱歉@fq-selbach，但这本可以通过插件处理，核心库里没必要有这个逻辑
fq-selbach
@artf好的，但你能告诉我怎么控制样式管理器的“Flex”类别吗？因为显示/隐藏的逻辑似乎是硬编码的 ：-/ 我可以用插件在“显示”选择器里添加“inline-flex”......但当选择时，它永远不会显示“Flex”类别。 或者你能不能教我怎么让“Flex”类别始终显示，而不是被“Display=flex”控制？
#31222020年11月9日作者 tranthanhhoa2 个回答
版本： 0.16.27 摘要： 复制组件缺少媒体样式 繁殖步骤： 试着在平板或手机上更改一些内容 复制更改后的组件 意料之中： 复制的组件具有媒体样式 真实： 重复组件没有媒体样式
artf
谢谢@tranthanhhoa我已经解决了你另一个[问题]（https://github.com/artf/grapesjs/issues/3122），那个是关于规则状态的问题，但我也注意到媒体也有类似问题，所以两者都准备好下一次发布了:)
ClaudeCode
谢谢你举报，@tranthanhhoa。 感谢你分享关于重复组件缺少媒体样式的报告。为了帮助团队调查并优先排序： 请提供： 一个最小可复现的例子（CodeSandbox/JSFiddle） 你的GrapesJS版本号 浏览器和操作系统信息 浏览器控制台的任何错误信息 重现问题的步骤 最有帮助的是什么： 简约代码示例（不是你整个项目） 屏幕录制或截图显示问题 明确区分预期行为与实际行为 你正在使用的GrapesJS配置 有了这些细节，维护者可以更快地识别和优先排序修复。Gra...
#31212020年11月9日作者 sadtaco1 个回答
我会说这既是功能请求，也算是个问题。 我觉得一个2015年以后几乎所有项目都用px的项目看起来很糟糕。 人们使用的屏幕尺寸在最窄的范围内只有768像素，无论是移动端还是桌面端，甚至2160p及更大。 “像素”测量对此不利。 这样的工具是为非技术人员设计的，他们不会理解屏幕上像素测量看起来正常的东西，但并非所有屏幕上都正确。 最像GrapeJS的就是 carrd.co 对吧？在那里，他们实际上只是用一些随意的“尺寸”测量，然后内部转换，这样最终用户就无法做出愚蠢的操作。 我的建议： 去除控件界面中的px，以及GrapeJS本身样式中的CSS。新默认用vmax、rem和/或%替换。 是的，通常有百分比和/或EM和REM的下拉菜单，但p...
ClaudeCode
谢谢你举报，@sadtaco。 FEAT/ISSUE： CSS 标准的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。 尝试什么： 添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤： 如果还没测试过，请用最新的GrapesJS版本测试 提供最小可重复的示例（CodeSandbox）——这有助于团队更快识别根本原...
#31202020年11月8日作者 mohd74692 个回答
我想让设备和菜单按钮都放在同一个面板上，但问题出在查看代码按钮上 如果我移除 'panel.render（）' 设备按钮 就会消失 如果我不移除“panel.render（）”，查看代码就无法使用 我到底哪里做错了？ ![图片]（https://user-images.githubusercontent.com/12613564/98472369-6be82b80-2214-11eb-9933-ead334d82654.png）
artf
检查一下[Panel API]（https://grapesjs.com/docs/api/panels.html#panels），你用得完全错误......
ClaudeCode
谢谢你举报，@mohd7469。 关于查看代码按钮的问题，问得很好。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something changed'））;...
#31192020年11月6日作者 makkaronis4e4 个回答
你好，我想用 Grapesjs 的组件制作自定义方块。 我找到了添加组件的解决方案：https://github.com/artf/grapesjs/issues/1334#issuecomment-411519845 但我在添加 CSS（无论是字符串还是对象）时遇到了困难。
artf
你应该能做到类似这样的操作： “''js ... 组成要素： [ { 标签名：'h1'，组件：'Some <b>content</b>'， }， “<style>......”</style> ] ```
makkaronis4e
@artf谢谢，它能用，但我发现了bug。 当你把这个块放到画布上时，它能正常工作，但如果你从画布中删除这个元素，或者清除整个画布，然后第二次把这个块放到画布上，它就会丢失CSS。第二次，第三次......没关系，如果你从画布中移除过元素一次，下一次掉落时它会失去样式。
artf
@makkaronis4e这种情况，我会请你做一个可复现的演示
#31182020年11月6日作者 zhiyuanzhang-unai2 个回答
你有一份开箱即用的方块图标列表（CSS类）吗？ 我在界面上看到了一些不错的方块图标，但不想看到完整列表。
artf
默认情况下，编辑器内加载了一个 Font Awesome 库 https://github.com/artf/grapesjs/blob/347e529e23e630b7e4d003b4f40c888f2fecd738/src/editor/config/config.js#L159-L161
ClaudeCode
谢谢你举报，@zhiyuanzhang-unai。 感谢你分享关于封锁图标列表的报告。为了帮助团队调查并优先排序： 请提供： 一个最小可复现的例子（CodeSandbox/JSFiddle） 你的GrapesJS版本号 浏览器和操作系统信息 浏览器控制台的任何错误信息 重现问题的步骤 最有帮助的是什么： 简约代码示例（不是你整个项目） 屏幕录制或截图显示问题 明确区分预期行为与实际行为 你正在使用的GrapesJS配置 有了这些细节，维护者可以更快地识别和优先排序修复。Gr...
#31172020年11月6日作者 zhiyuanzhang-unai2 个回答
我会在运行时根据下拉菜单构建自定义组件。当用户更改下拉菜单的选择时，相关自定义块会被添加，非相关块则被移除。 所有自定义方块按不同类别名称分组。 如果该类别中的所有方块都被移除，它会显示在屏幕上。 有没有办法移除某个类别？或者如果没有阻挡，它会自动被移除？
artf
尝试用新的块集合重新[render]（https://grapesjs.com/docs/api/block_manager.html#render）块管理器
ClaudeCode
谢谢你举报，@zhiyuanzhang-unai。 关于如果类别中没有组件，如何移除，这是个很好的问题。推荐的组件方法是使用事件驱动的API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something...