作为React中组件的SVG上的多色填充

import { ReactComponent as MySVG } from 'path/to/svg/file.svg';
import './MyComponent.css';

const MyComponent = () => {
  return (
    <div>
      <MySVG className="svg-icon" />
    </div>
  );
};

.svg-icon {
  fill: red;
}

const MyComponent = () => {
  return (
    <div>
      <MySVG style={{ fill: 'red' }} />
      <MySVG style={{ fill: 'blue' }} />
      <MySVG style={{ fill: 'green' }} />
    </div>
  );
};

.red-svg {
  fill: red;
}

.blue-svg {
  fill: blue;
}

.green-svg {
  fill: green;
}

const MyComponent = () => {
  return (
    <div>
      <MySVG className="red-svg" />
      <MySVG className="blue-svg" />
      <MySVG className="green-svg" />
    </div>
  );
};