React忽略svg元素上的xmlns属性

Question

我有一个生成SVG的React组件：

const SVG = (props) => (
    <svg
        xmlns="http://www.w3.org/2000/svg"
        { ...props }>
        {/* ... */}
    </svg>
)

我使用此组件直接在页面上显示内联SVG。我希望能够将SVG导出为.svg文件。我试过这个：

const markup = renderToStaticMarkup(<SVG />) // imported from 'react-dom/server'

然后我对这个标记进行编码，并将其放在一个基本的链接元素中。它工作正常，但SVG文件不正确。 React删除xmlns属性，这是将SVG用作图像所必需的。

如何使用我的组件正确导出SVG文件？我找到的唯一解决方案是使用正则表达式将属性添加到渲染标记，但这非常难看。 ：/