reactjs - 为什么 IonIcon 组件会抛出错误，而 Text 组件却没有？

Question

我是 React Native 的新手，这是我的主要 App.js 组件：

import React from 'react'
import { StyleSheet, Text, View } from 'react-native'
import { Ionincons} from '@expo/vector-icons'

export class App extends React.Component {
  render (){
    return (
      <View style={styles.container}>
       <Ionincons name='ios-pizza'/>
  </View>
  )
}
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  }
})

当我尝试运行这个简单的代码时，我收到以下消息：

Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s%s, undefined,  You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

但是当我用一个简单的交换IonIcons组件时， <Text>Hello</Text/>一切正常。我在这里想念什么？

标签： reactjsreact-nativereact-native-android

Answer 1

你有一个拼写错误，Ionincons应该是Ionicons：

import { Ionicons } from '@expo/vector-icons';

和

<Ionicons name='ios-pizza'/>