问题 #2822💬 已回答提出于 2020年6月11日作者 Lighost0 个反应

SVG在编辑器中不可见

快速解答作者 RJCAM

你好@Lighost 我觉得问题出在那个SVG,因为只有这个不正常工作。 这可能包含一些自定义块本身未能正确理解的代码。 一个解决办法是本地保存 svg,然后用编辑器的默认图片块放出去,我测试过了,效果不错。 我也用很多不同的SVG测试过同样的问题,它们都正常工作。

阅读下方完整回答 ↓

问题

你好, 我需要把 SVG 放进我的项目,所以我用自定义代码组件来实现这个目的。但当我把 svg 内容复制到 component 时,什么都没有显示。但当我查看生成索引时,SVG是可见的。我在演示编辑器里也试过同样的方法,但在编辑器和预览模式下都看不到。我用最新的 Safari 和最新版的 Google Chrome 测试过,当然我用的是最新版本的 GrapesJS(0.16.12)。

通缉的SVG来源是[这里](https://pastebin.com/35k7PFBG)

编辑器中的效果: ![](https://i.snipboard.io/gYPmI1.jpg)

index.html中的样子(在我的页面中) ![](https://i.snipboard.io/gpdJEY.jpg)

起初我以为错误可能出在我的SVG,但那样它在索引里就看不到了。有人知道出了什么问题吗?

回答(2)

RJCAM2020年6月11日

你好@Lighost 我觉得问题出在那个SVG,因为只有这个不正常工作。 这可能包含一些自定义块本身未能正确理解的代码。 一个解决办法是本地保存 svg,然后用编辑器的默认图片块放出去,我测试过了,效果不错。 我也用很多不同的SVG测试过同样的问题,它们都正常工作。

Lighost2020年6月11日

@RJCAM 是的,我知道,我已经做过了,比如插入 SVG 作为 img。但我真的需要把它作为 svg 对象插入——因为我需要用填充属性做一些悬停效果。无论如何,不知怎么的,它开始在编辑器中显示出来。我不知道我做了什么,因为我刚改了三次SVG类别填充,现在它们在编辑器里都能看到了。所以对我来说,我决定关闭这个问题,因为它已经解决😄了。

相关问答

通过相似的问题讨论继续研究。

与此问题匹配的付费插件

根据问题关键词和标签相关性精选,助你更快交付。

查看全部插件

正在加载付费插件推荐……

免费方案

在以下平台查看开源 GrapesJS 插件: GitHub 或在我们的免费目录中快速搜索。

浏览免费插件 →
高级方案

高级插件提供支持、定期更新和生产就绪的功能——为你节省数天的集成工作。

浏览高级插件 →

浏览插件分类

直接跳转到市场上的插件分类页面。