React Native Firebse Flat List Данные не отображаются в тексте и изображении

Question

Мои данные не отображаются, я использую FireBase в режиме реального времени, и я протестировал на реакции нативный эмулятор Android в Android Studio:

<FlatList
   data={this.state.userList}
   keyExtractor={(item,index)=>item.article_title}
   renderItem={({item}) =>
       <View style={{alignItems:'center',justifyContent:'center'}}>
           <Image style={{height:40,width:40,borderRadius:20}}
               source={{uri:`${item.article_image}`}} />
           <Text style={{color:'black',fontWeight:'bold',fontSize:30}}>
              {item.article_title}
           </Text>
       </View>
   } />

Answer 1

Спасибо за ваши ценные ответы, причина моей проблемы, а не проблема преобразования массива: версия Firebase :)

Answer 2

Скорее всего, проблема в том, что данные, возвращаемые из базы данных, не являются массивом.Попробуйте преобразовать его в массив, либо перебирая себя по объекту, либо используя одну из вспомогательных функций lodash.

Примерно так: преобразовать объект в массив с помощью lodash

Используя lodash, вы можете сделать это:

<FlatList
    data={_.values(this.state.userList)}
    keyExtractor={(item, index) => item.article_title}
    renderItem={({item}) =>

        <View style={{alignItems: 'center', justifyContent: 'center'}}>
            <Image style={{height: 40, width: 40, borderRadius: 20}}
                   source={{uri: `${item.article_image}`}}/>
            <Text style={{color: 'black', fontWeight: 'bold', fontSize: 30}}>{item.article_title}</Text>

        </View>

    }/>

Answer 3

Мой массив конвертировать,

state={
userList:[]
}
ComponentWillMount()
{
  firebase.database().ref().child('datas').once('value',(snap) =>{
    let userList=[]
    snap.forEach((data) =>{
      const {article_title,article_content,article_image}= data.val()
      userList.push({article_title,article_content,article_image})
    })
    this.setState({userList})
  })
}

Answer 4

removeClippedSubviews = {false} используйте его.если это не работает, тогда попробуйте оптимизацию плоского списка проверьте эту ветку