ios - React-Native with Redux : API objects appear in my console. 日志但不是我的观点

Question

我正在使用 react、react-native、react-native-router-flux、 构建一个简单的运动应用程序react-redux，使用 redux 并尝试将热门新闻对象的 api 拉到我的 View 。我需要的对象显示在我的控制台日志上，但无法让它显示在我的 View 上。

我收到的错误是:

Cannot read property 'cloneWithRowsAndSections' of undefined

TypeError: Cannot read property 'cloneWithRowsAndSections' of undefined at 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)
    });
  }

新闻_查看:

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 is not defined ReferenceError: ds is not defined

我尝试取出构造函数:

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

然后将其定位到 NewsList 类之外，然后我setState，如下所示:

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

但这只会导致错误:

Cannot read property 'bind' of undefined TypeError: Cannot read property 'bind' of undefined

Answer 1

2 个选项:

1.在构造函数中创建 const ds = ...，如 this.ds = ...

2.将其从构造函数函数中取出:

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

并将其定位在 NewsList 类之外。

现在，当您setState时，请这样做:

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