React本機元素類型無效。檢查渲染方法

Question

我環顧四周，其中大部分問題是導致或導出不正確的結果，但我檢查了我的應用程序，我不確定導出/導入不正確。這是我得到的確切的錯誤。

React.createElement：類型無效 - 預期一個字符串（ 內置組件）或類/功能（用於複合組件） 但得到：對象。您可能忘記從其定義的 文件中導出組件。檢查渲染方法FooterTabs。

不確定渲染方法意味着什麼。該組件沒有渲染方法。反正...

所以FooterTabs只是我渲染一些頁腳標籤

import React, { PropTypes } from 'react' 
import { View, Text } from 'react-native' 
import { Tabs, Tab, Icon } from 'react-native-elements' 
import { HomeContainer, TrackLibraryContainer } from '~/containers' 
import { NimbusCamera } from '~/components' 

export default function FooterTabs (props) { 
    console.log(props) 
    FooterTabs.propTypes = { 
     navigator: PropTypes.object.isRequired, 
     dispatch: PropTypes.func.isRequired, 
     activeFooterTab: PropTypes.string.isRequired, 
     setFooterTab: PropTypes.func.isRequired, 
    } 
    return (
     <Tabs> 
      <Tab 
       selected={props.activeFooterTab === "home"} 
       titleStyle={{fontWeight: 'bold', fontSize: 10}} 
       selectedTitleStyle={{marginTop: -1, marginBottom: 6}} 
       title="Home" 
       onPress={(tab) => props.dispatch(props.setFooterTab("home"))} 
       renderIcon={() => <Icon containerStyle={{justifyContent: 'center', alignItems: 'center', marginTop: 12}} color={'#5e6977'} type="ionicon" name='ios-home-outline' size={33} />}> 
       <HomeContainer navigator={navigator}/> 
      </Tab> 
      <Tab 
       selected={props.activeFooterTab === "camera"} 
       titleStyle={{fontWeight: 'bold', fontSize: 10}} 
       selectedTitleStyle={{marginTop: -1, marginBottom: 6}} 
       title="Record Preview" 
       onPress={(tab) => props.dispatch(props.setFooterTab("camera"))} 
       renderIcon={() => <Icon containerStyle={{justifyContent: 'center', alignItems: 'center', marginTop: 12}} color={'#5e6977'} type="ionicon" name='ios-camera-outline' size={33} />}> 
       <NimbusCamera navigator={navigator}/> 
      </Tab> 
      <Tab 
       titleStyle={{fontWeight: 'bold', fontSize: 10}} 
       selectedTitleStyle={{marginTop: -1, marginBottom: 6}} 
       title="Available Streams" 
       onPress={(tab) => props.dispatch(props.setFooterTab("library"))} 
       renderIcon={() => <Icon containerStyle={{justifyContent: 'center', alignItems: 'center', marginTop: 12}} color={'#5e6977'} type="ionicon" name='ios-musical-notes-outline' size={33} />}> 
       <TrackLibraryContainer navigator={navigator}/> 
      </Tab> 
     </Tabs> 
    ) 
} 

我然後導出爲app/components/index.js像export { default as FooterTabs } from './FooterTabs/FooterTabs'

已導入導出的相同方式的所有其他部件。

我可能只是需要另一組眼睛在這裏。如果您需要查看任何其他文件代碼，請告知我們。

謝謝！

Answer 1

我認爲navigator是未定義的，導致在渲染子組件時出錯。在這種情況下，您的HomeContainer，NimbusCamera和TrackerLibraryContainer組件中的navigator={navigator}需要更改爲navigator={props.navigator}。