#32332021年1月15日作者 Abhisheknanda13444632 个回答
你好@artf 有没有什么标准方法可以在每个组件上添加一个新工具栏 我试过这种方法 “''js 编辑。Components.getTypes（）.map（type => { 编辑。Components.addType（type.id， { 型号：{ 默认值：{ 工具栏， 特质：[ ...编辑。Components.getType（type.id）.model.prototype.defaults.traits， ...[ ] ] }, } }) }); const toolbar = [{ 属性：{ 等级：“Fa Fa-Arrow-Up” }, command： e => e.runCommand（'core：component-...
ClaudeCode
谢谢你举报，@Abhisheknanda1344463。 关于在每个组件上设置工具栏的好问题。推荐的组件方法是使用事件驱动的API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something chang...
#32322021年1月15日作者 matiasmasciotta2 个回答
你好，我遇到了以下问题： 我需要一个事件类型编辑器（“sorter： drag： end”），在所有这些情况下都会被投掷： （检测我投放的元素和位置） 1- 当你从blockManager拖放一个元素并放到画布上时，让它听到。 2- 当你把已经组件化的元素从画布拖到画布的另一个区域时，让它听到声音。 3- 当我在 layerManager 中移动元素时会听到这个声音。 用排序器我解决了情况2,1没有出现，因为元素还没有被分成，所以在尝试添加属性时，在被分成之前，它作为标准元素被添加到html画布中，忽略了我手动添加的属性。 你能帮我吗？ 谢谢
bgrand-ch
你好， 对于未来的问题或技术问题（非漏洞），GitHub的[讨论]（https://github.com/artf/grapesjs/discussions）标签是最佳选择。 如果问题已解决，请关闭，或在[讨论]（https://github.com/artf/grapesjs/discussions）->[问答]（https://github.com/artf/grapesjs/discussions/categories/q-a）类别写一条详细的新消息（并关闭本期）。...
ClaudeCode
谢谢你举报，@matiasmasciotta。 关于拖放组件的好问题。ProseMirror 推荐的方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something change...
#32312021年1月13日作者 vatte214 个回答
大家好， 我们都知道 GJS-CKeditor-plugin 是处理 [data-gjs-type]=“text” 组件的。 我想知道，我们能不能改变这个选项？ 我想自己创建一个自定义组件，比如 [data-gjs-type]=“anyDiv”，并且拥有类似的功能 [data-gjs-type]=“text”。也许有人知道怎么改变？ 也许我可以在 CKeditor 配置里改一下？例如，当我们初始化CKeditor时： 选项：{ !!!!!例如： 格式：'text'，想添加（'anyDiv'）， 语言：“恩”， startupFocus：确实如此， extraAllowedContent： '（）;{}'， // 允许任意类和任意内...
Abhisheknanda1344463
@vatte21 让你的组件可以编辑。你必须这样扩展组件中的文本类型 “''js 编辑。Components.addType（'anyDiv'， { 型号：{ 默认值：{ 类型：“文本”， 特质：[ ...编辑。Components.getType（type.id）.model.prototype.defaults.traits， ...[] ] }, reRender（） { this.view.render（）; }, }, 扩展：“文本”， isComponent：...
vatte21
@Abhisheknanda1344463 谢谢！我会试试
abulka
@Abhisheknanda1344463你的代码片段给我提示错误“Uncaught ReferenceError： type is not defined” “类型”在哪里定义？
#32302021年1月13日作者 alivex3 个回答
你好; 谢谢大家提供这么棒的工具，我真的很喜欢文档，使用起来很简单。 我觉得我遇到了第一次动态关闭模态后再也打不开的问题。 示例：
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 个回答
你好@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...
#32262021年1月11日作者 chenjingling902 个回答
我怎么控制属性显示在一行还是两行，比如演示版？ ![图片]（https://user-images.githubusercontent.com/46340968/104158854-2ff66000-5429-11eb-8d8d-dc40ff2e3e38.png） ![图片]（https://user-images.githubusercontent.com/46340968/104158859-3389e700-5429-11eb-9825-570f8df6b064.png） 当我将 project grapesjs-preset-newsletter 下载到本地时，也显示了两行填充和边距，这让我很困惑。 事实上，我希望它们能灵...
ClaudeCode
谢谢你举报，@chenjingling90。 关于FEAT：如何在一行中设置4个属性，比如填充、边际的好问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'...
#32252021年1月9日作者 Abhisheknanda13444632 个回答
你好@artf 我尝试用复选框特性更新样式，但它没有调用函数。 这是代码 非常感谢你能提供的任何见解！ 谢谢
Abhisheknanda1344463
@artf 搞定了，傻乎乎的——错误 移动模型中的初始化函数。 结案
ClaudeCode
谢谢你举报，@Abhisheknanda1344463。 关于如何从复选框特性更新样式？的好问题。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'...
#32242021年1月8日作者 marcepoblet3 个回答
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 个回答
我一直在玩 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：*”事件进行细致跟踪 构...
#32222021年1月7日作者 bgrand-ch3 个回答
我会手动在渲染组件中添加一个新节点。 视觉效果还可以，但无法保存，因为我的风格不是用自动生成的GrapesJS ID。 要手动解决这个难题，我双击要进入的组件，然后在画布主体中点击外部。然后，将 GrapesJS ID 和 'data-gjs-type='text' 添加到新节点，从而可以保存。 Vue.js： “Main.vue”文件的一部分： “''js 文本编辑器 https://grapesjs.com/docs/api/richtexteditor.html https://css-tricks.com/creating-vue-js-component-instances-programmatically/ const...
bgrand-ch
优化后的“TextEditor.vue”文件： “''js // ... onFontValidate （） { const { rte } = this.getRteData（） const spanNode = document.createElement（'span'） 设 anchorNode = {} this.selection.childNodes.forEach（childNode => { console.log（{ childNode }） if （ch...
bgrand-ch
i️ 它不能直接用 HTML，只能用 JSON。 Component = JSON 节点（html元素 + GrapesJS 数据） “''js addStylesToText （styles， tagName = 'span'） { const inlineStyles = styles.map（style => style.join（'：'））.join(';') + ';' const selectedComponent = this.editor.getSelect...
ClaudeCode
谢谢你举报，@bgrand-ch。 关于新节点添加后如何刷新/重新渲染？的好问题。ProseMirror 推荐的方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something...