无状态React组件中的范围出现问题

Question

我正在使用React Storybook开发一些组件。以下内容接受图标的名称并输出svg。

import React from 'react';
import { string } from 'prop-types';

const Icon = ({ icon }) => {
let resolved = require(`_assets/svg/${icon}.svg`).default;

if (!resolved) {
    throw Error(`Could not find icon ${icon}`);
}

return React.createElement(resolved);

}

Icon.propTypes = {
    icon: string.isRequired
}


export default Icon;

当我调用一个组件时，这很好用，但是，如果我尝试显示一种以上类型的图标，它们将不会出现，或者有时全部显示为所调用的第一个图标。我认为这是一个范围问题，但我似乎无法解决。