Question

我是反应原生的新手，为什么下面的FlatList不能渲染我的数据源？

  componentDidMount(){            
        var _data = [{title: "Test Title",  timestamp : "2018-10-02:23:11:45" }];

        this.setState({
            isLoading : false,
            dataSource :  { _data }
        });
    }

 render() {
    if(this.state.isLoading){
      return(
        <View style={{flex: 1, padding: 20}}>
          <ActivityIndicator/>
        </View>
      )
    }

    return (
        <View style={styles.body}>
          <View>
            <FlatList
              data={this.state.dataSource}
              renderItem={({item}) => <Text style={styles.item}>{item.title}, {item.timestamp}</Text>}
              keyExtractor={(item,index) => index}
              extraData={this.state.isLoading}
            />
          </View>
        </View>
    );
  }
}

如果我将对象数组内联，那么它可以正常工作：

data={[
    {title: "Test Title", timestamp : "2018-10-02:23:11:45" }
]}

Answer 1

下面

this.setState({
            isLoading : false,
            dataSource :  { _data }
        });

您正尝试将_data设置为对象without key到datasource state object，即删除大括号

只需将其替换为dataSource : _data

即可

React Native：FlatList不呈现

1 个答案: