无法在React Native中使用新导入的组件？

Question

我一直在研究这个程序，最近我尝试使用React-native库中的一些新组件，例如Icon和Header但是每当我尝试在render函数中使用它们时，我都会报错：

“不变违反：不变违反：元素类型无效：预期使用字符串（对于内置组件）或类/函数（对于复合组件），但得到：未定义。您可能忘记了从定义于其中的文件中导出组件，或者您可能混淆了默认导入和命名导入。”

这对我来说真的很奇怪，因为我曾经而且现在仍在使用Image ， Text和View类的组件而没有问题，所以我不明白为什么现在这些新组件会出现问题。 我不确定自己在程序中进行了哪些更改，导致发生了这种情况。

我唯一能想到的是“设置”曾经是默认类，但现在不是默认类，但这不能解释我从库中使用的旧组件仍然如何工作。 请记住，我导入的其他组件（例如Image和其他组件）仍然可以使用。

这是违规代码的片段：

import React, { Component } from 'react';
import {StyleSheet,  Text, View,  TouchableHighlight,  Image, Header, Icon} from 'react-native';
import { createStackNavigator } from 'react-navigation';

export class Settings extends React.Component {

  render(){
    return (
      <View>
        <View style={{height: 55,  backgroundColor: '#007ebc'}}>
          <View style={{flexDirection: "row", marginLeft: 10}}>
           <Icon //<-------USING ICON WILL GIVE ME ERROR
             name = 'arrowleft' 
           />             
           <Image source={require("../assets/LogoLrg.png")} 
            style={{ width: 55, height: 30, marginTop: 10 }}   
            />
            <Text style={styles.headerText}>   Settings </Text>
          </View>
        </View>
      </View>
    )
  }

Answer 1

除非我错过了React Native的一些重大更新，否则您无法从react-native导入Header和Icon组件，因为它们不存在。 这些组件可能是某些开源库（例如react-native-elements或native-base ，因此您首先必须安装它们：

npm i native-base --save 

要么，

npm i react-native-elements --save

然后使用它们：

import { Header, Icon } from 'react-native-elements' //or 'native-base'

RN元素： Icon ， Header

本机基础： Icon ， Header

Answer 2

我认为React-native库中不存在Icon或Header组件。

您可以在react native网站或react-native.js源代码中进行检查。

http://facebook.github.io/react-native/docs/getting-started