GrapesJS 问题

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

状态

排序

找到 183 个问题

🔍 documentation

#33822021年4月2日作者 Squirrel14892 个回答

1 个反应

提问缺陷文档 typescript

Not able to add more than 2 projects under free version

![截图（11）]（https://user-images.githubusercontent.com/57554308/113369015-1a505280-9315-11eb-8d48-c9b8bdef335e.png）警告请阅读并遵循接下来的三步，然后在发布问题前删除它们遵守贡献指南 https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.md先快速搜索一下，看看有没有人没开同样的问题所有相关陈述/问题都必须填写/回答，否则问题可能已结案JSFiddle 入门模板 https://jsfiddle.net/szLp8h4nCodeSandbox 入门模板 http...

Ju99ernaut

grapesjs 和 grapedrop 是两个独立项目，你应该在这里提出你的问题 https://spectrum.chat/grapedrop

GJSBlock

谢谢你举报，@Squirrel1489。在免费版本下无法添加超过两个项目的问题似乎是竞争条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。尝试什么：添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤：如果还没测试过，请用最新的GrapesJS版本测试提供最小可重复的示例（CodeSandbox）——这有助于团队更快识别...

查看详情

#33692021年3月28日作者 jcsofts3 个回答

0 个反应

提问文档 typescript

优点：是否可以为色彩选择器添加相对偏移量

![图片]（https://user-images.githubusercontent.com/33087222/112741199-0a074300-8fb6-11eb-83e9-aa665b9291d3.png）例如：我在编辑器外面加了左边栏和上边栏。我知道颜色选择器的位置是相对于身体的，所以是否可以在配置中添加关联偏移？那我可以加一个-40来让选色器调到正确的位置吗？

artf

你应该能通过这种方式定义颜色选择选项 “''js Grapesjs.init（{ colorPicker： { ... } }); ``` 这里您可以查看所有[可用选项]（https://github.com/artf/grapesjs/blob/86ce053309235c2a0a8bed9d9ded4326e82310df/src/utils/ColorPicker.js#L11）

skru

在 .init（）之后，可以访问 colorPicker 吗？我想动态更新托盘

GJSBlock

谢谢你举报，@jcsofts。关于FEAT：是否可以为颜色选择器添加相对偏移，这是个很棒的问题。GrapesJS 推荐的方法是使用事件驱动 API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式： “JavaScript 留意变化 editor.on（'change'，（） => console.log（'someth...

查看详情

#33642021年3月25日作者 NagarRahul3 个回答

0 个反应

提问增强文档 typescript

FEAT：@How在容器内拖动元素时，固定容器大小，Container 将根据子拖拽元素被消耗。我们如何根据父容器自动调整子元素大小。容器不应根据子元素来消耗。应该是显示卷轴。

警告请阅读并遵循接下来的三步，然后在发布问题前删除它们遵守贡献指南 https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.md先快速搜索一下，看看有没有人没开同样的问题所有相关陈述/问题都必须填写/回答，否则问题可能已结案JSFiddle 入门模板 https://jsfiddle.net/szLp8h4nCodeSandbox 入门模板 https://codesandbox.io/s/1r0w2pk1vl 你想给GrapesJS添加什么？详细描述你的功能需求详细最新版本有替代方案吗？[ ] 是的（描述替代方案）[ ] 不这是否与某个问题有关？[ ] 是的（请...

NagarRahul

@artf ![图片]（https://user-images.githubusercontent.com/42827466/112465042-40607a80-8d8a-11eb-828c-a0e88ca7e113.png）我拖动按钮时，它就是消耗。我想修复它。拖动新按钮时不应该消耗。溢出后会滚动鞋卷。

artf

这主要取决于组件的样式（比如用Display Inline-Block来控制那个按钮可能会解决这个问题）

GJSBlock

谢谢你举报，@NagarRahul。关于FEAT：@How在容器内拖拽元素时，固定容器大小，容器会根据子拖拽元素被消耗。我们如何根据父容器自动调整子元素大小。容器不应根据子元素来消耗。应该是展示卷轴。！虽然这个具体功能还没有出现在核心 API 中，但有几种方法可以实现类似的行为。使用事件系统： “JavaScript editor.on（'component：update'，（component） => { 你的逻辑 }); ``` 替代方法：听取“selector...

查看详情

#33632021年3月24日作者 nairdapuiu2 个回答

1 个反应

提问组件文档 typescript

Set content function empties the component content

我正在尝试用 set 函数来更改组件的内容，但实际上结果是一个空组件，内部什么都没有。这是一个代码总结的示例使用版本：0.16.44 预期的行为是什么？执行的代码应生成一个包含文本“foo”的组件。目前的行为是什么？执行后的代码会清空组件内容。在0.16.34版本中，一切正常运行。这个问题有解决办法吗，还是我应该继续用0.16.34版本？

artf

你不应该使用“content”属性，应该用“selectedComponent.components（str）”。

GJSBlock

谢谢你举报，@nairdapuiu。关于Set content function清空组件内容，这个问题很棒。推荐的组件方法是使用事件驱动的API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式： “JavaScript 留意变化 editor.on（'change'，（） => console.log（'somethi...

查看详情

#33552021年3月22日作者 Franci5co5aoco3 个回答

0 个反应

提问文档 typescript

Add a title attribute to the Layers panel elements

你好@artf，当我在图层面板中嵌套多个元素时，由于图层面板宽度不够大，有些元素名称会被截断，我知道自定义可调整大小面板可以解决，但大多数用例中添加标题属性就足够了。 ![截图 2021-03-22 14 50 53]（https://user-images.githubusercontent.com/23215166/112005599-338e1d80-8b23-11eb-9596-8e436734d383.png）一个提示（标题）对用户会很有帮助。 grapesjs/src/navigator/view/ItemView.js 也许在跟随行添加标题属性能解决问题吗？ https://github.com/artf/gra...

artf

是啊，为什么不呢......你想创建一个永久纪录吗？:)

Franci5co5aoco

@artf当然，谢谢！我要做公关......

GJSBlock

谢谢你举报，@Franci5co5aoco。关于FEAT：在图层面板元素中添加标题属性，这是个很好的问题。GrapesJS 推荐的方法是使用事件驱动 API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式： “JavaScript 留意变化 editor.on（'change'，（） => console.log（'s...

查看详情

#33532021年3月19日作者 jcsofts2 个回答

0 个反应

提问 style-manager 缺陷文档

The colorpicker scroll off the input box

感谢你的工作，这是个不错的项目，可能不是个bug。我尝试让样式管理器中的色彩选择器滚动，输入框也一样。例如：（颜色，背景）输入框打开选色器滚动样式管理器输入框移动了，但颜色选择器仍停留在原来的位置我在 Grapesjs 演示网站上试过这个 <img width=“506” alt=“WeChat944c23a71851577e18470c0dec31441e” src=“https://user-images.githubusercontent.com/33087222/111763958-a73ee900-88dd-11eb-9751-b6012039d577.png”> <img width=“510” alt=“W...

artf

颜色选择器绝对地放置。除非你能找到方法在样式管理器的滚动页面上更新，否则我看不到其他办法。

GJSBlock

谢谢你举报，@jcsofts。关于颜色选择器从输入框滚动的问题非常好。推荐的 StyleManager 方法是使用事件驱动的 API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式： “JavaScript 留意变化 editor.on（'change'，（） => console.log（'something cha...

查看详情

#33472021年3月18日作者 xinnai4 个回答

0 个反应

提问 style-manager 组件文档 typescript

How can I get Uncompressed JS code for me to edit?

你好，感谢你帮我解答这个问题。我想用自己的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里看起来是这样的： ![1444126130]（https://user-images.githubusercontent.com/23135336/112428513-3b91cb80-8d76-11eb-91de-ce51a8500203.jpg）这些代码都是压缩的。我想要像这样一个未压缩...

artf

“autoBeautify” 是传递给 CodeMirror 的一个选项，但无论如何，它可能会美化代码，但不会解压，因为代码本身就是这样存储在组件里的

查看详情

#33452021年3月17日作者 joshk1324 个回答

0 个反应

style-manager 组件增强文档画布

面板和按钮部分，入门时无法使用 Vue.js

我正在努力让 grapejs 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

查看详情

#33362021年3月12日作者 fahad1572 个回答

0 个反应

文档 typescript 常规

Single click text edit

让文本可编辑需要大量点击，我们能让文本字段在一次点击中可编辑吗？我知道，拖动方块时单击会很烦人，这已经很常见了，但就我的情况来说，我想只编辑单击，如果可能的话请指导一下。

artf

https://github.com/artf/grapesjs/issues/3146#issuecomment-733687439

GJSBlock

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

查看详情

#33342021年3月11日作者 KernelDeimos2 个回答

0 个反应

缺陷提问组件文档画布

Attempts to load scripts to canvas maybe breaks javascript??

版本： 0.16.44 你能重现演示中的bug吗？ [ ] 是的 [x] 不预期的行为是什么？真的，其他任何东西都行详细描述那个漏洞我当时正试图将脚本加载到画布中。我第一次尝试是“脚本：[]”，然后遇到了这个PR帖子里提到的同步问题：https://github.com/artf/grapesjs/pull/67 我看到@artf的一个例子展示了另一种用一个叫“components”的属性来实现。这样做会导致JavaScript解析器失效。我不是开玩笑;我发了截图来证明。还有一点有趣的是：控制台里写着“TAG LOAD”的文字来自我试图加载的脚本。所以......成功了吗？尽管页面因语法“无效”而崩溃。目前的行为是什么...

KernelDeimos

我有一阵子没用内联“<script>''标签了，也忘了HTML解析器的这个限制。关上这个。

GJSBlock

谢谢你举报，@KernelDeimos。尝试将脚本加载到Canvas时，可能会破坏JavaScript的问题？？似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。尝试什么：添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤：如果还没测试过，请用最新的GrapesJS版本测试提供最小可重复的示例（CodeSa...

查看详情

GrapesJS 问题

浏览所有主题