2017-02-03 6 views
0

저는이 작업을하기 위해 며칠 동안 고생했습니다. React Native의 ListView를 Firebase 데이터베이스의 데이터로 채 웁니다. 나는이 설정을 가지고 :ReactNative ListView에 Firebase 데이터를 채우십시오.

const ListItem = require('./profileRow'); 

var database = firebase.database(); 
var userId, dataKey; 



    class Selection extends Component { 


     constructor(props) { 
     super(props); 

     userId = firebase.auth().currentUser.uid; 

     this.dataRef = firebase.database().ref('/users/' + userId + '/profiles_info'); 

      this.state = { 
      dataSource: new ListView.DataSource({ 
       rowHasChanged: (row1, row2) => row1 !== row2, 
      }) 
      }; 

     } 

     listenForProfiles(dataRef){ 
     dataRef.on('value', (snap) => { 

      var profiles = []; 
      snap.forEach((child) => { 
      profiles.push({ 
       name: child.val().forename, 
       _key: child.key 
      }); 
      }); 
      alert(profiles); 
      this.setState({ 
      dataSource: this.state.dataSource.cloneWithRows(profiles) 
      }); 
     }); 
     } 

     componentDidMount() { 
     this.listenForProfiles(this.dataRef); 
     } 

     render() { 


      return (
      <Image source={require('../assets/bg.png')} style={styles.container}> 

      <View style={{flex: 1, flexDirection:'column'}}> 
      <Text> 
       Select a profile to view: 
      </Text> 

      </View> 

      <View style={{flex: 1}}> 

      <ListView dataSource={this.state.dataSource} renderRow={this._renderItem.bind(this)} enableEmptySections={true} style={styles.listview}> </ListView> 

      </View> 

      </Image> 
     ); 

     } 

     _renderItem(item) { 
     return (
      <ListItem item={item}/> 
     ); 
     } 

    } 

자료 구조는 다음과 같습니다 enter image description here

그래서 내가 여기서 할 노력하고있어하면 "뒤따라야"각 "프로필의 문자열로의 ListView의 각 행을 채울 것입니다 "디렉토리 (0,1,2). 그러나 내 alert() 반환 된 : [object Object],[object Object],[object Object] "profiles_info"및 각 "forename"String 해당 디렉터리에서 개체로 디렉터리를 반입하는 것을 의미합니다합니다.

이것은 내가 갇혀있는 곳입니다. 누군가가 이것에 대해 밝힐 수 있기를 바랍니다. 솔루션이 무엇인지 알아야합니다. 코드에 적용하는 방법을 모르겠습니다.

미리 감사드립니다.

답변

1

당신은 여기에 귀하의 프로필 배열로 객체를 추진하고있다, 그래서 당신의 경고 개체를 보이고있다 의미가 있습니다 필드가 namekey 인 개체 profiles[0].name에 액세스하면 실제 이름이 표시됩니다.

alert 대신 console.log을 사용하면 더 의미있는 정보를 얻을 수 있습니다.

+0

Jeff에게 감사 드려요. – Benni

0

다음 안내를 따르십시오. 당신을 도울 수 있습니다. 당신이 alert(JSON.stringify(profiles)); 대신 alert(profiles);으로 사용하는 경우의 배열을 볼 수

profiles.push({ 
    name: child.val().forename, 
    _key: child.key 
}); 

:

react-native-firebase-tutorial-list

+0

고마워요.하지만 전에 살펴 봤는데 본질적으로 튜토리얼이 보여주는 것과 같은 방법을 사용하고 있습니다. 내 질문에 대한 자세한 내용은 어떻게 올바른 디렉터리를 통해 반복하고 각 목록에서 특정 데이터를 내 Listview로 가져올 수 있습니다. – Benni

관련 문제