陣營本土元素類型是無效的 - 出口

與react-native很新的，被卡住的「元素類型是無效的錯誤」陣營本土元素類型是無效的 - 出口

import React, { Component } from 'react'; 
import { 
    AppRegistry, 
    StyleSheet, 
    Text, 
    ActivityIndicatorIOS, 
    View 
} from 'react-native'; 

export default class SplashWalls extends Component { 

    constructor(props) { 
    super(props); 

    this.state = { 
     wallsJSON: [], 
     isLoading: true 
    }; 
    } 

    fetchWallsJSON() { 
    var url = 'https://unsplash.it/list'; 
    fetch(url) 
     .then(response => response.json()) 
     .then(jsonData => { 
     console.log(jsonData); 

     this.setState({isLoading: false}); //update isLoading 
     }) 
    .catch(error => console.log('Fetch error ' + error)); 
    } 

    componentDidMount() { 
     this.fetchWallsJSON(); 
    } 

    render() { 
    var {isLoading} = this.state; 
    if(isLoading) 
     return this.renderLoadingMessage(); 
    else 
     return this.renderResults(); 
    } 

    renderLoadingMessage() { 
    return (

    <View style={styles.loadingContainer}> 
     <ActivityIndicatorIOS 
      animating={true} 
      color={'#fff'} 
      size={'small'} 
      style={{margin: 15}} /> 
      <Text style={{color: '#fff'}}>Contacting Unsplash</Text> 

    </View> 
    ); 
    } 

    renderResults() { 
    return (

    <View> 
     <Text> 
      Data loaded 
     </Text> 

    </View> 
    ); 
    } 

} 

const styles = StyleSheet.create({ 
    loadingContainer: { 
     flex: 1, 
    flexDirection: 'row', 
    justifyContent: 'center', 
    alignItems: 'center', 
    backgroundColor: '#000' 
    } 
}); 

AppRegistry.registerComponent('SplashWalls',() => SplashWalls);

錯誤狀態：

元素類型無效：預期字符串（對於內置組件）或類/函數（用於複合組件），但得到：未定義。您可能忘記將您的組件從其定義的文件中導出。

檢查'SplashWalls'的Render方法。

任何想法？

來源

2017-07-30 alex99_14

嘗試結合您的渲染方法，在構造函數中：'這一點。 renderLoadingMessage = this。 renderLoadingMessage.bind（this）'，第二種方法相同。 –

什麼是你的項目文件夾的名稱？只有SplashWalls？ –

這裏的問題是你

<ActivityIndicatorIOS />

該組件已經過時，必須與

<ActivityIndicator>

更多信息替換可以在這裏找到：https://facebook.github.io/react-native/docs/activityindicator.html

要繼續this教程您必須做出以下更改：

import { 
    AppRegistry, 
    StyleSheet, 
    Text, 
    View, 
    ActivityIndicator, 
} from 'react-native';

和

renderLoadingMessage() { 
    return (
     <View style={styles.loadingContainer}> 
     <ActivityIndicator 
      animating={true} 
      color={'#fff'} 
      size={'small'} 
      style={{margin: 15}} /> 
     <Text style={{color: '#fff'}}>Contacting Unsplash</Text> 
     </View> 
    ) 
}

來源

2017-08-19 10:20:17 richardXYZ

陣營本土元素類型是無效的 - 出口

回答

相關問題