将SVG嵌入到ReactJS中

JavaScript

达蒙理查德

2020-03-11

是否可以将SVG标记嵌入到ReactJS组件中?

render: function() {
  return (
    <span>
      <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmln ...
    </span>
  );
}

结果错误:

不支持命名空间属性。ReactJSX不是XML。

最简单的方法是这样做。使用React React之类的东西对于我想做的事情来说是过大的手段。

第790篇《将SVG嵌入到ReactJS中》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

1个回答
宝儿村村 2020.03.11

如果您只是想包含一个静态svg字符串,则可以使用dangerouslySetInnerHTML

render: function() {
    return <span dangerouslySetInnerHTML={{__html: "<svg>...</svg>"}} />;
}

React将直接包含标记而不进行任何处理。

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android