React Native Dynamic Component name错误

Question

我正在使用React Native开发我的第一个应用程序，我遇到了动态组件名称的问题。 我用一个名为IconAccounts的类调用了两个道具：icon和bgColor。 props图标表示需要在IconAccount内呈现的组件（反应原生SVG组件）。 一切都应该有效，但我有一个错误：

Invariant Violation: View config not found for name iconName

IconAccount：

import iconName from "../path/to/iconName"
someMethods(){}
render(){
        const TagName = this.props.icon
        return (
            <View style={{backgroundColor: '#'+this.props.bgColor}}>
                <TagName/>
            </View>
        )
    }

调用IconAccount：

<IconAccounts icon="iconName" bgColor="#ffffff"/>

图标代码示例（使用svg-to-react-native-cli生成）

export default function iconName(props) {
  return (
    <Svg>
        //SvgThings
    </Svg>
  );
}