React-Native with Redux：API 对象出现在我的 console.log 中，但不在我的视图中

Question

我正在使用react、react-native、react-native-router-flux、react-redux 和redux 构建一个简单的体育应用程序，并试图将一个热门新闻对象的api 拉到我的view 中。我需要的对象显示在我的 console log 上，但无法让它显示在我的 view 上。

我得到的错误是：

无法读取未定义的属性“cloneWithRowsAndSections”

TypeError：无法读取属性“cloneWithRowsAndSections” 不明确的 在 NewsList.componentWillMount

我有什么遗漏的吗？

新闻列表：

export default class NewsList extends Component {
  constructor(props){
    super(props);
      const ds = new ListView.DataSource({
        rowHasChanged: (row1, row2) => row1 != row2,
        sectionHeaderHasChanged: (s1, s2) => s1 !== s2
       });
      this.state = {
        dataSource: ds.cloneWithRowsAndSections(props.ListData)
      }
  }

  componentWillReceiveProps(nextProps){
    const dataSource = this.state.dataSource.cloneWithRowsAndSections(nextProps.ListData);
    this.setState({dataSource});
  }


  componentWillMount(){
    // console.log("whats This: ",this.props.ListData);
    let data = this.props.ListData;
    this.setState({
      dataSource: this.ds.cloneWithRowsAndSections(data)
    });
  }

News_View：

render(){
console.log('TopNews', this.state.TopNews);
if(this.state.TopNews.length == 0){
  return(
    <View style={styles.container}>

      <View style={styles.LiveStyle}>
        <Live style={styles.LiveStyle} />
      </View>

      <View style={styles.container}>
        <Text style={[styles.NotFollowTeamMsg, styles.centerTeamMsg]}>
          Your not connected to the api
        </Text>
      </View>
    </View>
  )
} else {
  return (
      <View style={styles.container}>
        <NewsList
          ListData={this.state.TopNews}


        />
      </View>
  )
}


 }

在构造函数中，我尝试将const ds = ... 更改为this.ds = ...，但这只会导致错误：

ds 未定义 ReferenceError: ds 未定义

我尝试取出构造函数：

const ds = new ListView.DataSource({
rowHasChanged: (row1, row2) => row1 != row2,
sectionHeaderHasChanged: (s1, s2) => s1 !== s2
});

然后将其定位在 NewsList 类之外，我 setState，像这样：

this.setState({
  dataSource: ds.cloneWithRowsAndSections(data)
});

但这只会导致错误：

无法读取未定义类型错误的属性“绑定”：无法读取 未定义的属性“绑定”

Answer 1

2 个选项：

1.在您的构造函数中将const ds = ... 设为this.ds = ...

2.把这个从constructor函数中去掉：

const ds = new ListView.DataSource({
rowHasChanged: (row1, row2) => row1 != row2,
sectionHeaderHasChanged: (s1, s2) => s1 !== s2
});

并将其定位在NewsList 类之外。

现在，当你 setState 时，这样做：

this.setState({
  dataSource: ds.cloneWithRowsAndSections(data)
});