已收录 3,464 个 GitHub 问题 — 370 个已解决 · 90 个待解决 搜索、筛选并探索经过实战检验的答案。
找到 336 个问题
🔍 style-manager图书馆很棒！它满足所有要求，唯独有一个：网站文本翻译。 我在议题队列和文档中翻遍了各种地方，但不知为何找不到关于这个话题的任何信息。我的客户不在乎 grapesjs 编辑器是英文的。他们想要的是能够轻松地将文本翻译成网站的任意语言。 如果首页页头写着“欢迎访问我的网站”，他们会希望有一个简单的选项：将鼠标悬停在该文本，点击下拉菜单，然后点击翻译，可能会弹出弹窗，将该行翻译成法语或其他他们想用的网站语言。当然，访客还需要一个语言下拉选择器。 有类似的吗？如果不行，这种插件的粗略结构应该是什么？
artf
这需要你自己去做。也许可以自定义文本组件，这样可以根据所选语言更改内容。
jordandevogelaere
@acondura你有解决办法吗？我对我的客户也有同样的要求。 谢谢
gxanshu
我也有同样的要求。是的，我们唯一能实现这一点的方法就是创建自己的组件
你好@artf！ “JavaScript “编辑”： { “CSS”： “* { 框大小：border-box; }#wrapper{字体家族：Helvetica，Arial Black，无衬线;color：#9500b3;}“， “html”：“<div id=\”iecr\“>将你的文本插入此处</div>”， “资产”：“[]”， “styles”：“[{\”selectors\“：[\”#wrapper\“]，\”style\“：{\”font-family\“：\”Helvetica，Arial Black，无衬线\“，\”color\“：\”#9500b3\“}}，]”， “组件”：“[]” } } ``` 有没有办法...
artf
你应该可以用“editorInstance.getCss（）”从任何 GrapesJS 实例中获取 CSS。这基本上是从“样式”JSON 生成 CSS
ClaudeCode
谢谢你举报，@lacieri。 关于[问题]：解析样式到Css字符串的好问题。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something...
警告 请阅读并遵循接下来的三步，然后在发布问题前删除它们遵守贡献指南 https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.md先快速搜索一下，看看有没有人没开同样的问题所有相关陈述/问题都必须填写/回答，否则问题可能已结案JSFiddle 入门模板 https://jsfiddle.net/szLp8h4nCodeSandbox 入门模板 https://codesandbox.io/s/1r0w2pk1vl 版本： 你可以在控制台输入“grapesjs.version”获得版本 你能重现演示中的bug吗？ [ ] 是的 [ ] 不 预期的行为是什么？ 详细描述那个漏...
ClaudeCode
谢谢你举报，@nithinpillalamarri123。 如何自定义葡萄js表单以附加样式的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。 尝试什么： 添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤： 如果还没测试过，请用最新的GrapesJS版本测试 提供最小可重复的示例（CodeSandbox）——这...
Grapesjs 的颜色选择器在 Chrome 和 Firefox 之间工作方式不同。当你打开选中的组件，而该组件之前从未设置过背景色（例如......），颜色选择器在Chrome中设置为100%不透明度，Firefox中设置为0%。 问题是用户在使用Firefox时甚至可能热点查看这个透明度滑块，尝试更改颜色却失败，却没意识到透明度是0%。 预期行为： 在所有浏览器中，当被样式的组件从未指定背景色时，颜色选择器默认会将透明度设置为100%。 实际行为： 在Chrome中，颜色选择器正常工作。在Firefox中，颜色选择器最初总是以不透明度滑块为0%打开。 提前感谢你的精彩项目！！ 版本： 最新消息 你可以在控制台输入“grape...
mhowey
@artf Firefox 和 Chrome 的另一个区别是调色板显示的内容。Firefox显示透明方框，而Chrome显示灰色方框。
artf
似乎在最新的Firefox版本上已经解决了
ClaudeCode
谢谢你举报，@mhowey。 Firefox中*色彩选择器透明度滑块在0的问题似乎是竞赛条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。 尝试什么： 添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤： 如果还没测试过，请用最新的GrapesJS版本测试 提供最小可重复的示例（CodeSandbox）——这有助于团队更快识别根...
版本： 0.16.27 你能重现演示中的bug吗？ [ ] 是的 [ ] 不 [X] 视频但没有演示 预期的行为是什么？ 添加尽可能多的嵌套“span”元素，并保留它们的样式/ID。 目前的行为是什么？ 从两个嵌套的“span”元素中，父“span”元素的样式/ID会消失。 你能附上截图、截屏或实时演示吗？ [X] 是的（附上） [ ] 不 https://user-images.githubusercontent.com/17108974/106736579-e9ee7f80-6615-11eb-9f5e-a3236d026c98.mp4 TextEditor.vue “''js // ... 方法：{ onButtonClic...
artf
你好，Benjamin，这个bug已经修复了（报告bug时，请确保使用最新版本）
ClaudeCode
谢谢你举报，@bgrand-ch。 v0.16.27 - 嵌套 span 时样式/ID 消失的问题似乎是竞赛条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。 尝试什么： 添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤： 如果还没测试过，请用最新的GrapesJS版本测试 提供最小可重复的示例（CodeSandbox）——这...
你好@artf 我正在尝试这样更改显示属性的类型和输入值 -： 但在样式管理器中按钮是看不到的。 我们如何自定义显示属性 “''js const styleManager = 编辑器。风格经理; styleManager.addSector（'div-only-sector'，{ 名称：“设定”， 开启：真， buildProps： ['width'， 'height']， 性质： [{ 名称：“可见性”， 属性：“显示”， 类型：“无线电”， 性质：[ {value：“继承”，标题：“可视性”}， {值：“无”，标题：“隐藏”} ], }] }); ``` 演示 -： https://codepen.io/abhi_punk81...
nilchu
你必须使用“列表”属性来定义你的选项。在无线电选项对象中，应该读的是“name”而不是“title”。 “JavaScript const styleManager = 编辑器。风格经理; styleManager.addSector（'div-only-sector'， { 名称：“设定”， 开启：真， buildProps： ['width'， 'height']， 性质： [{ 名称：“可见性”， 属性：“显示”， 类型：“无线电”， 列表：[{ 名称：“可见性”，...
Abhisheknanda1344463
非常感谢@nilchu你的帮助。
ClaudeCode
谢谢你举报，@Abhisheknanda1344463。 关于自定义样式管理器的好问题。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'somet...
我在尝试如何更改画布内元素的样式时，发现用颜色选择器特性设置元素的内联样式颜色属性（不是通过getCS（）获得的内联样式标签），但使用getHtml（）时，这个样式属性完全消失了。我注意到在各期问题中有一个被弃用的 propertyavoidInlineStyle。如果是这样，为什么会出现这种情况？为什么现在不再是这个选项了？我想把CSS保存在特别需要的地方，内联保存，不想多一个样式标签和所有独特的ID，因为我没有使用样式管理器。这有可能实现吗？
artf
@DodoTrip原因是内联CSS不能定义带有状态（例如'：悬停'）和媒体查询的样式，所以我一直觉得它是个无用的限制，而不是功能。尽管如此，如果你不需要组件响应性或不同状态，你仍然可以使用这个选项。
ThetripGr
你好，@artf，感谢你的回复。能举个例子说明现在是怎么做的吗？还是应该避免InlineStyle让它更容易使用？
artf
说实话，我很早就不再用 avoidInlineStyle，但我想它应该能用 😁
附加代码： 保存HTML时： <div class=“gjs-row”> <div class=“gjs-cell”> <div class=“gjs-row”> <div class=“gjs-cell”> <div id=“i6x6”> <div id=“bsrne9exd5” style=“height：300px” tg=“DataGrid” tagName=“DataGrid” class=“ag-theme-alpine”> </div> </div> </div> <div class=“gjs-cell”> <div id=“ibc4”> <div id=“3drqn6v2q5” style=“height：300...
nithinpillalamarri123
请大家帮我解决这个问题 editor.setComponents（html 文本）; 从已保存的模板HTML加载脚本后，脚本没有按预期运行 拖放保存后用 editor.setComponents（html 文本）加载 HTML 后，它就能正常工作; 然后用现有的脚本替换像“< >这样的符号，用浏览器相关的代码，这种情况只在版本0.16.34中出现
artf
你无法将生成的HTML代码加载回编辑器，请阅读关于如何正确存储和加载模板的文档 https://grapesjs.com/docs/modules/Storage.html
ClaudeCode
谢谢你举报，@nithinpillalamarri123。 感谢你分享关于 grapes js 版本 v0.16.34 在加载已保存的 html 后出现意外脚本代码的报告。为了帮助团队调查并优先排序： 请提供： 一个最小可复现的例子（CodeSandbox/JSFiddle） 你的GrapesJS版本号 浏览器和操作系统信息 浏览器控制台的任何错误信息 重现问题的步骤 最有帮助的是什么： 简约代码示例（不是你整个项目） 屏幕录制或截图显示问题 明确区分预期行为与实际行为 你...
版本：0.16.34 预期的行为是什么？ 编辑器初始化时，没有选择任何元素，因此样式管理器应像编辑器配置中未使用“appendTo”时一样，提示“使用样式管理器前选择元素”。 目前的行为是什么？ 在编辑器配置中使用“appendTo”时，像这样： 样式管理器开始时显示所有扇区，但未选择任何元素 演示 同样的行为也可以在 https://grapesjs.com/docs/getting-started.html#style-manager 的例子中看到
mosh-tudor
我用这段代码来解决这个问题： “''js const showStylesSector = editor => { const stylesButton = 编辑器。Panels.getButton（“panel-sidebar-header”， “show-styles”）; const layersButton = 编辑器。Panels.getButton（“panel-sidebar-header”， “show-layers”）; 如果图层管理器处于激活状态，请禁用...
Nielsticot
这不是我想要的，我的问题是在选择任何元素之前，也就是在触发“component：selected”事件之前。 我通过在编辑器加载时选择一个元素暂时解决了这个问题，但这并不是我真正想要的
artf
如果你在自定义元素中使用 StyleManager，那你必须自己处理那个状态。 '''html <div class=“sm-wrapper”> <div id=“styles”></div><!-- 这里是你添加样式管理器 --> <div class=“sm-empty-state”> 选择一个元素 </div> </div>
如何从演示版导入HTML和CSS到升级版，一次性导入？
ClaudeCode
谢谢你举报，@CarlucciMods。 关于从演示版导入HTML和CSS升级版，一次性导入？的好问题。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.lo...