undefined不是对象(评估’allRowsIDs.length’)(React-Native)

我是React-Native的新手.按照基本的React-Native教程,我试图从“ https://facebook.github.io/react-native/movies.json”获取JSON数据.我可以显示标题和描述属性但是当我尝试使用ListView显示“movies”属性时,我收到以下错误：

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>
      );
  }
}

您最初的问题是您已将this.state.dataSource设置为字符串’init’.您希望它指向您之前声明的数据源.

如果你改变,你可以解决你的第一个问题：

this.state = { 
   dataSource: 'init',};

对此：

this.state = {
   dataSource: ds
};

但是,这只会让您收到新的错误消息.对象的效果不能作为React子进行….你可以通过更改渲染函数来修复它,以返回一个简单的字符串而不是整个对象.我建议你先从标题开始,然后从那里开始.试试这个,你应该在路上：

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

undefined不是对象(评估’allRowsIDs.length’)(React-Native)

猜你在找的React相关文章