重定向失败：react-native-svg：React.createElement：类型无效

问题描述

我正试图了解一个错误。当我将我的第一个屏幕重定向到另一个屏幕时，我会进入捆绑器：

“警告：React.createElement：类型无效-预期为字符串 （对于内置组件）或类/函数（对于复合 组件），但得到了：％s。％s％s，对象，“

我猜问题出在svg软件包中-是在我单击时：

      <TouchableOpacity onPress={() => this.props.navigation.navigate("distance")}>
        <View style={styles.statContainer}>
          <imagebackground
            source={require("../../assets/images/stats-background-1.png")}
            style={styles.statimage}
          >
            <View style={styles.row}>
              <Text style={styles.statText}>
                {i18n.t("stats.action.dist")}
                {"\n"}
                <AnimateNumber
                  value={this.state.stats.total_distance}
                  countBy={(this.state.stats.total_distance / 50).toFixed(0)}
                  style={styles.statTextData}
                />{" "}
                {i18n.t("stats.unit.kilometre")}
              </Text>
            </View>
          </imagebackground>
        </View>
      </TouchableOpacity>

第二个屏幕的代码是：

export default class Stats extends React.Component {
  constructor(props) {
    super(props);
    };

  render() {
    return (
    <ScrollView style={styles.containerScrollNoMargins}>
      <Header
        backgroundImage={require("../../assets/images/bg-header.png")}
        centerComponent={{
          text: i18n.t("stats.title"),style: styles.headerComponentStyle,}}
        containerStyle={styles.headerContainerStyle}
        statusBarProps={{ barStyle: "light-content" }}
      />
      <imagebackground
        source={require("../../assets/images/background-stats.jpg")}
        style={{flex : 1 }}
        imageStyle={{ resizeMode: 'stretch' }}
      >
         <Svg height="50%" width="50%">
             <Image href={require('../../assets/images/Interface_Stat_1.svg')} />
        </Svg>
      </imagebackground>
    </ScrollView>
    );
  }
}

我没有得到什么错误，您能给我任何提示，帮助吗？ 非常感谢您的时间和解释。

解决方法

似乎失败，因为您在Image标签内使用了RN的SVG组件。

它仅支持list中的子级，Image仅支持here中提到的某些格式，例如png,jpg,jpeg,bmp,gif,webp,psd。要解决此问题，您可以查看react-native-svg-transformer，它将帮助您轻松导入本地svg文件。