Question

我想从Firebase DB中检索数据。

以下是数据的结构：

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);

但除了StatusBar之外什么都没有出现。那么有人可以提供指导以纠正此错误吗？

Answer 1

您没有传递firebase的参考路径来从中获取数据。理想情况下应该是

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

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

使用ReactNative检索Firebase数据

1 个答案: