React Native ListView - TypeError:无法读取未定义的属性'cloneWithRows'(...)

时间:2016-10-27 02:18:10

标签: javascript android listview react-native

尝试从此api创建列表视图但我一直收到此错误

TypeError:无法读取未定义的属性'cloneWithRows'(...)

可能很容易解决,但我很困惑!

继承我的代码

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

var heros = [];

class Heros extends Component {
  constructor(props) {
    super(props)
    var dataSource = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 != r2})
    this.state = {
      peopleDataSource: dataSource.cloneWithRows(heros)
    }
  }

  componentDidMount() {
    this.getHeros(function(json){
    heros = json;
    this.setState = ({
      datasource: this.state.dataSource.cloneWithRows(heros),
      isLoading:false
    })
  }.bind(this));

  }

  getHeros(callback) {
    var url = "https://api.lootbox.eu/xbl/us/Food%20Market/competitive-play/heroes";
    fetch(url)
    .then(response => response.json())
    .then(json => callback(json))
    .catch(error => console.log(error));
  }

  render() {
    return (
      <View>
        <ListView
          style={{marginTop: 100}}
          dataSource={this.state.peopleDataSource}
          renderRow={(person) => { return this._renderPersonRow(heros)
          enableEmptySections={true} }} />
      </View>
    )
  }

  _renderPersonRow(person) {
    return (
      <View style={styles.personRow}>
        <Text style={styles.PersonName}> {person.name} </Text>
      </View>
    )
  }
}

module.exports = Heros;

1 个答案:

答案 0 :(得分:2)

您的数据存储变量名为peopleDataSource(在构造函数中声明),但您尝试使用this.state.dataSource访问它。它应该是this.state.peopleDataSource。应该是:

this.setState = ({
  peopleDataSource: this.state.peopleDataSource.cloneWithRows(heros),
  isLoading:false
})