相关疑难解决方法(0)

我想使用这种技术http://css-tricks.com/svg-fallbacks/并更改svg颜色,但到目前为止我还没有能够这样做.我把它放在css中,但不管是什么,我的形象总是黑的.我的代码:

.change-my-color {
  fill: green;
}

<svg>
    <image class="change-my-color" xlink:href="https://svgur.com/i/AFM.svg" width="96" height="96" src="ppngfallback.png" />
</svg>

从stackoverflow 的这个答案中，我得到了一个关于如何将 svg 导入为ReactComponent并更改其颜色/宽度等的解决方案。

但是动态导入是否可以做同样的事情呢？我的功能组件：

import * as React from 'react';
import SvgIconComponent from './SvgIcon.Interface';

import {ReactComponent} from '*.svg';

const SvgIcon: React.FC<SvgIconComponent> =({width, color, name}) =>
{
    import(`../../assets/icons/${name}.svg`).then((Icon) => {
        return <Icon fill={color} width={width}/>
    });
};

export default SvgIcon;

在当前的实现中我收到错误：

TS2749: 'ReactComponent' refers to a value, but is being used as a type here. // .then((Icon as ReactComponent)

TS2604: JSX element type 'Icon' does not have any construct or call signatures. // .then(Icon)