#33482021年3月18日作者 FreshImmuc2 个回答
嘿,我知道有人解释过怎么用这个,但我没明白......我该如何使用这个?
ClaudeCode
谢谢你举报,@FreshImmuc。 关于怎么做的好问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('something changed')); 组件生命...
#33472021年3月18日作者 xinnai4 个回答
你好,感谢你帮我解答这个问题。我想用自己的JSEditor来编辑html、css和js。 1、首先,我用 'getHtml', 'getCss', 'getJs' 在我的 JSEditor 里显示代码。我发现JS代码是压缩的。我怎样才能获得无压缩代码? 我用的是'编辑器'。CodeManager.getCode(model, 'js')',而且它也是压缩版的。我看了源代码,也不太明白为什么 CodeManager 能显示无压缩代码。 2、还有一点是:当我设置JS代码,比如“document.getElementById(”wrapper“).style.background = ”red“'时,并做以下操作: 'const htm...
artf
组件用JS的“脚本”依赖于你源代码中的同样代码。比如,如果你创建了一个插件,然后用webpack/babel构建它,组件就会打印构建结果。我想你可以为你的“脚本”组件单独创建 js 文件,然后让捆绑器忽略那些文件。
xinnai
@artf 你好,我不确定你是否理解我的问题。 我想在我自己的 js 编辑器里编辑 js 代码,首先我用 'getJs(') 从你的编辑器里设置了 js 代码,但你demo.html里看起来是这样的:  这些代码都是压缩的。我想要像这样一个未压缩...
artf
“autoBeautify” 是传递给 CodeMirror 的一个选项,但无论如何,它可能会美化代码,但不会解压,因为代码本身就是这样存储在组件里的
#33462021年3月18日作者 xinnai4 个回答
我想用像 Element-UI 这样的 UI 框架自己构建样式管理器,快速做出一个美观的界面。但我该如何将属性绑定到选定的组件上?我没看到像“setProperties to an element...”这样的API。你能帮我讲讲怎么做吗,非常感谢!!
RutujaBadbe
#2296 这可能对你有帮助!
artf
我想如果你需要从零开始创建样式管理器,这种方法应该可行 “''js 让targetsToStyle = []; const eventToListen = 'component:toggled component:update:classes change:state change:device'; const sm = 编辑。风格经理; editor.on(eventToListen, () => { targetsToStyle = editor.getSelected...
xinnai
@artf 这正是我需要的!非常感谢!
#33452021年3月17日作者 joshk1324 个回答
我正在努力让葡萄Vue.js工作,但没有进展,我一直在跟着起步,但没能让它正常工作。到目前为止,我已经把它加到了“mounted()”部分,也拿到了带方块的按钮可以显示和添加,但[面板和按钮部分](https://grapesjs.com/docs/getting-started.html#panels-buttons)一直没成功。 问题总结:使用Vue.js我无法让面板和按钮部分从开始时显示出来。 下面我附上了我目前主要想添加的App.vue文件——概念验证会稍后移到合适的位置。
uchoaaa
看看这个问题,可能会有帮助:https://github.com/artf/grapesjs/issues/275
artf
你好@joshk132说代码看起来不错,你能做一个可复现的演示吗(比如Codesandbox之类的软件)?
joshk132
@artf我已经让面板显示的位置正常工作了,但现在显示不正常了。我不得不做的解决方案是改用下面的代码。基本上我必须把“editor”作为变量,但我在最初的代码里已经去掉了,因为 vue linter 会抱怨。附上了一张图片链接,展示了下面代码的效果,我不太确定具体是什么原因导致了样式问题。 https://imgur.com/GuFqv0o
#33442021年3月17日作者 NagarRahul3 个回答

artf
这种方法需要你组件中使用的 JS。所以,如果你没有带有 JS 的组件,它就会是空的
ClaudeCode
谢谢你举报,@NagarRahul。 关于FEAT:我正在尝试用getJs()方法获取js,但得到的是空值。我该如何获得 js?。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => con...
#33432021年3月17日作者 neilkyoung4 个回答
版本: 0.16.44 你能重现演示中的bug吗?[x] 是的[ ] 不 设置'编辑器'。Parser.getConfig().keepEmptyTextNodes = true;' 在控制台中,然后尝试将表单拖入一个两列插件。 预期的行为是什么? 详细描述那个漏洞 据我观察,当定义了可丢弃属性时,“keepEmptyTextNodes”会抛出带有 Sorter.js 的错误。当它试图确定有效性时,最终会先获得文本节点,导致匹配比较失败(文本节点不支持匹配)。 目前的行为是什么?* 问题区域似乎是下面Sorter.js 这是因为tempModel拥有文本节点,可以包裹块中定义的内容。当移除它以获得 dropModel 时,我们得到...
artf
嗯,是的,这很合理,也许我们应该选第一个“有效”元素(也就是真正支持“匹配”的那个)。 但我也很好奇你关于使用“keepEmptyTextNodes”的理由是什么。几天前我其实还在考虑把它😂拆掉
neilkyoung
@artf 我们用于网页创作的系统实现了这一点。不过现在我们已经说服他们关闭了这个功能,感谢你上面的评论:-D
artf
太好了,那我就关上了。如果你那边的变更有问题或不同,请告诉我
#33422021年3月17日作者 RutujaBadbe2 个回答
嗨! 我尝试过在Canvas和index.html中添加jQuery。 我正在这样用canvas添加它—— 'canvas = 编辑。画布; const script1 = document.createElement('script'); script1.src = 'https://code.jquery.com/jquery-3.6.0.min.js'; canvas.getDocument().head.appendChild(script1);' 在HTML页面里我把它加成了script标签——'<script src=“https://code.jquery.com/jquery-3.6.0.min.js”></scr...
artf
这里你可以看到如何正确加载依赖 https://grapesjs.com/docs/modules/Components-js.html#template-related
ClaudeCode
谢谢你举报,@RutujaBadbe。 错误 ReferenceError: $ 未定义 发生在 Canvas 尝试访问属性时,尚未完全初始化组件生命周期。这是GrapesJS中常见的竞争条件。 立即解决办法: 如果你控制代码,可以用空检查包裹调用: “JavaScript 如果(component && typeof component.getDocument === 'function') { 你的准则 } ``` 根本原因分析: Canvas 在调用 'getDocu...
#33412021年3月15日作者 HeyWrecker4 个回答
你好, Facebook社交媒体组件是用来提供指向企业或组织Facebook页面的链接,还是专门用来分享与你时间线相关的内容?看起来是后者,尽管我觉得这有点反直觉,因为很多邮件的页眉和页脚只是提供社交媒体账户的链接。我只是想确认一下它的设计方式,以及如果它确实按设计正常运行,有没有什么变通方法或计划改变这种行为。 此致, 里克
artf
我猜你就是在找这个 https://github.com/artf/grapesjs-mjml
HeyWrecker
作为后续,我确认了Instagram社交部分确实链接到了Instagram的主页。而Facebook选项则不链接到Facebook页面。
#33402021年3月15日作者 xinnai3 个回答
你好,感谢你的工作。我有个问题。我想做一个类似Codepen的视图,并且想让Grapesjs视图可以上下拖动。但当我拖动它时,工具会去错位置,鼠标悬停高亮元素的位置也错了。我尝试过 splitjs 和其他开源代码,但总是遇到这个问题。 你能帮帮我吗?非常感谢!! https://user-images.githubusercontent.com/23135336/111138227-a5fa7d00-85ba-11eb-9393-0f3307322a56.mp4
Ju99ernaut
你可以试试运行 'editor.refresh()'
xinnai
@Ju99ernaut 非常感谢,你救了我一命!
ClaudeCode
谢谢你举报,@xinnai。 关于我在分格中放置葡萄时,gjs-cv-tools 位置错误的问题很棒。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('some...
#33392021年3月14日作者 Nigus3 个回答
我们正在开发一个使用 Grapes js 的 CMS 系统。我们设计了一个条件,不能在“mediaCondition”中添加宽高比,保持方向。我们的设计编辑器有16:9比例的竖屏和横屏设计模式。但我们希望增加更多宽高比,比如18:9、19:9和19.5:9,这样设计页面就能在不同的移动设备上放大。
artf
抱歉,你能更好地说明你需要什么吗?你对编辑器的最终CSS期望是什么?
no-response[bot]
由于我们请求原作者提供更多信息未获回应,本期已自动关闭。仅凭当前期刊中的信息,我们没有足够的信息采取行动。如果您有答案或找到我们需要的答案,请随时联系我们,以便我们进一步调查。
ClaudeCode
谢谢你举报,@Nigus。 关于问题:如何在设备管理器中为移动设备添加不同的宽高比,非常好。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('something...