使用ReactNative检索Firebase数据

我想从Firebase DB检索数据。使用ReactNative检索Firebase数据

下面是数据的结构：

words{ 
    word1{ 
     english:english 
     french: french 
    } 
    word2{ 
     english:english 
     french: french 
    } 
}

我想显示在ListView法文版。

到目前为止，我有这样的：

 // Initialize Firebase 
const firebaseConfig = { 
    apiKey: "AIzaSyDWedZY1svNHxPUi2ReQJTlCf9Q60407E8", 
    authDomain: "streetfrench-a84df.firebaseapp.com", 
    databaseURL: "https://streetfrench-a84df.firebaseio.com", 
    projectId: "streetfrench-a84df", 
    storageBucket: "streetfrench-a84df.appspot.com", 
    messagingSenderId: "551358813028" 
}; 
const firebaseApp = firebase.initializeApp(firebaseConfig); 

class FirebaseReactNativeSample extends Component { 

    constructor(props) { 
    super(props); 
    this.state = { 
     dataSource: new ListView.DataSource({ 
     rowHasChanged: (row1, row2) => row1 !== row2, 
     }) 
    }; 
    this.itemsRef = this.getRef().child('items'); 
    } 

    getRef() { 
    return firebaseApp.database().ref(); 
    } 

    listenForItems(itemsRef) { 
    itemsRef.on('value', (snap) => { 

     // get children as an array 
     var items = []; 
     snap.forEach((child) => { 
     items.push({ 
      french: child.val().french, 
      english: child.val().english, 
      _key: child.key 
     }); 
     }); 

     this.setState({ 
     dataSource: this.state.dataSource.cloneWithRows(items) 
     }); 

    }); 
    } 

    componentDidMount() { 
    this.listenForItems(this.itemsRef); 
    } 

    render() { 
    return (
     <View style={styles.container}> 

     <StatusBar title="Dictionary" /> 

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


      </View> 
     ) 
     } 
    _renderItem(item) { 

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

} 

Expo.registerRootComponent(FirebaseReactNativeSample);

，但似乎没有什么不同之处的状态栏。那么任何人都可以提供给我一个指导，以纠正这个错误？

来源

2017-06-08 Sonia

是的，应该把'items'改为'words' – magneticz

好，它的工作原理，谢谢！ – Sonia

您未传递Firebase从中获取数据的参考路径。理想情况下它应该是

firebaseApp.database().ref('/words/word1/')。也不要忘记检查您在Firebase数据库控制台中的数据库规则中设置的权限。

如果您希望所有用户都可以访问和编辑数据，则必须将读写权限设置为true。

来源

2017-06-09 10:29:36

谢谢你现在的作品 – Sonia

使用ReactNative检索Firebase数据

回答

相关问题