一个页面上可以有多个 SVG 吗？（使用 svg-react-loader）

Question

我试图在同一个组件中导入和显示多个 SVG，但它实际上只是显示每次重复的第一个，而不是两个单独的 SVG。这是我的代码：

import React, { Component } from 'react';

import Account from '-!svg-react-loader!./svg/Account.svg';
import Alert from '-!svg-react-loader!./svg/Alert.svg';

<div className="col-lg-1">
  <Account className="icon" />
</div>

<div className="col-lg-1">
  <Alert className="icon" />
</div>

我们可以每页只有一个 SVG 实例吗？

Answer 1

对于任何阅读本文的人。看起来 Sketch 正在使用相同的 id -“#path-1”保存 SVG，当页面上有多个 SVG 时，它会中断。所以，答案是他们需要一个唯一的 ID。