SVG适用于Chrome,但不适用于Firefox

时间:2014-05-05 08:48:26

标签: firefox svg reactjs

我使用React制作了一个小型SVG演示,用于绘制六角网格。它在谷歌浏览器中运行良好,但Firefox似乎有正确的DOM,但没有显示元素。我的SVG有什么问题吗?

http://freiksenet.github.io/hexdrawer-svg/demo/

2 个答案:

答案 0 :(得分:1)

它们不呈现的原因是脚本生成的SVG元素具有XHTML名称空间(即#34; http://www.w3.org/1999/xhtml"),当它们应该具有SVG名称空间时(&# 34; http://www.w3.org/2000/svg"。)

当您在Chrome中向SVG添加元素时,它默认使用SVG命名空间,而FF则不是"聪明"。

我不了解ReactJS,所以我不知道是否有解决方法。

如果使用通用DOM方法(例如document.createElementNS()等),则可以正确创建它们。

答案 1 :(得分:-1)

Embedding SVG into ReactJS

在上面的链接中,Ben Alpert使用dangerouslySetInnerHTML显示了一种直接在页面中包含标记而无需对元素进行预处理的方法。

此属性还没有太多文档,但可以在以下页面找到: http://facebook.github.io/react/docs/jsx-gotchas.html

有关此功能缺少文档的详细信息,请参阅以下问题:https://github.com/facebook/react/issues/413