FlatList не отображает никаких данных на экране.Просто показывает пустой экран без ошибок - PullRequest
Новая
       27

FlatList не отображает никаких данных на экране.Просто показывает пустой экран без ошибок

0 голосов
/ 03 декабря 2018

Я новичок в изучении и изучении компонента FlatList.Но застрял на пустом экране.Я беспомощен, как отследить проблему.Использование android API уровня 22 и запуск в эмуляторе.

Мой код такой, как показано ниже. 

import React from 'react';
import { FlatList, StyleSheet, Text, View, Image } from 'react-native';

class feed extends React.Component{

    constructor(props){
        super(props);
        this.state = {
            photo_feed: [0,1,2,3,4],
            refresh: false
        }
    }

    loadNew = () => {
        this.setState({
            refresh: true
        });

        this.setState({
           photo_feed: [5,6,7,8,9],
           refresh: false    
        });
    }

    render(){

        return(

            <View style={{style: 1}}>
                <View style={ {height:50, paddingTop: 15, paddingBottom: 15, backgroundColor: 'white', borderColor: 'lightgrey', borderBottomWidth: 0.5, justifyContent: 'center', alignItems: 'center'} } >
                <Text> Feed screen </Text>
               </View>

                <FlatList 
                  refreshing={this.state.refresh}
                  onRefresh={this.loadNew}
                  data={this.state.photo_feed}
                  keyExtractor={ (item, index) => index.toString() }
                  style={{flex:1,  width: 480, backgroundColor:'#eee'}}
                  renderItem={({item, index}) => (
                    <View key={index}>
                         <View>
                             <Text>Time Ago</Text>
                             <Text>@Jagdish</Text>
                         </View>
                         <View>
                            <Image
                             source={{uri:'https://source.unsplash.com/random/500'+Math.floor((Math.random()*800)+500)}}
                             style={{resizeMode: 'cover', width:'100%', height: 275}}
                            />
                         </View>
                         <View>
                             <Text>Caption text here...</Text>
                             <Text>View comments...</Text>
                         </View>
                     </View>
                     )} 
                />            
            </View>
        )

    }
}

export default feed;

Информация о версии:

act-native-cli: 2.0.1

реакция-нативная: 0,57,7

Если у кого есть идеи.Пожалуйста, ответь.Заранее спасибо!

...