未定義不是一個對象（評估'allRowsIDs.length'）（React-Native）

Question

我對React-Native很新。遵循基本的React-Native教程，我試圖從「https://facebook.github.io/react-native/movies.json」中獲取JSON數據。我可以顯示title和description性能，但是當我嘗試使用ListView我收到以下錯誤顯示「電影」屬性：

undefined is not an object (evaluating 'allRowsIDs.length')

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

var ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2}); 

export default class AwesomeProject extends Component { 
    constructor(props) { 
    super(props); 
    this.state = { 
     dataSource: 'init', 
    }; 
    } 

    componentWillMount() { 
    fetch('https://facebook.github.io/react-native/movies.json') 
     .then((response) => response.json()) 
     .then((responseJson) => { 
     this.setState({ dataSource: ds.cloneWithRows(responseJson.movies) }); 
     }) 
     .catch((error) => { 
     console.error(error); 
     }); 
    } 

    render() { 
     return (
     <View style={styles.container}> 
      <ListView 
      dataSource={this.state.dataSource} 
      renderRow={(rowData) => <Text>{rowData}</Text>} 
      /> 
     </View> 
    ); 
    } 
} 

Answer 1

您最初的問題是，你設置this.state.dataSource到字符串'init'。你希望它指向你之前聲明的數據源。

可以解決你的第一個問題，如果你改變： this.state = { dataSource: 'init', };

這樣： this.state = { dataSource: ds };

然而，這只是打算讓你一個新的錯誤消息。 Objects are not valid as a React child...的影響。你可以通過改變你的渲染函數來返回一個簡單的字符串而不是整個對象。我會建議你從標題開始並從那裏移動。試試這個，你應該對你的方式：

render() { return ( <View style={styles.container}> <ListView dataSource={this.state.dataSource} renderRow={(rowData) => <Text>{rowData.title}</Text>} /> </View> ); }