使用ReactFire的防火墙用户专用数据

Question

我试图使用ReactFire来获取和显示特定于用户的数据。我已经按照火基非正规化建议组织了我的数据。这里来看看数据是如何构造的。

"notes" : {
    "n1" : {
        "note" : "[noteData]",
        "created_at" : "[date]",
        "updated_at" : "[date]",
    }
},
"users" : {
    "userOne" : {
    "name" : "[userName]",
        "notes" : {
            "n1" : true
        }
    }
}

只需使用FB (每次在记事本中输入按键时，ReactFire都会运行updateCode)，我就可以使用以下代码从应用程序中读取和写入数据：

componentWillMount: function() {
  firebaseRef.child('users/' + authData.uid + '/notes').orderByChild('date_updated').on("child_added", function(noteKeySnapshot) {
  // Take each key and add it to an array
  usersNotesKeys.push(noteKeySnapshot.key());
  // For each note key, go and fetch the Note record with the same key
  firebaseRef.child('notes/' + noteKeySnapshot.key()).once("value", function(noteSnapshot) {
    // Add that full note object to an array + the parent key
    var data = noteSnapshot.val();
    usersNotesList.push({
        'created_at': data.created_at, 
        'updated_at': data.updated_at,
        'note':       data.note,
        'key':        noteKeySnapshot.key()
    });
  });
  this.setState({
    usersNotesList: usersNotesList
  });
}.bind(this)); 
},

updateCode: function(newCode) {
  firebaseRef.child('notes/' + this.state.item['key']).on('value', function(noteSnapshot, prevChildKey) {
  // Look through the current note list and find the matching key and update that key with the new content.

    var data = noteSnapshot.val();
    updatedItem = {
        'created_at': data.created_at, 
        'updated_at': data.updated_at,
        'note':       data.note,
        'key':        noteSnapshot.key()
        };
        // console.log(updatedItem);
    this.setState({
      item: updatedItem
    });
  }.bind(this));
}

从技术上讲，这个代码是有效的。但它是缓慢缓慢的。

当我使用ReactFire直接写入便笺时，不需要通过用户，它工作起来非常棒，而且要简单得多。但我需要笔记才能成为用户专用的。因此，我想找到一种将ReactFire与此数据结构结合使用的方法。这个是可能的吗？

Answer 1

重要的是你不想听完整的音符树。这可以通过断言notes is不会在用户控制之外更改而实现。一个注释可能会被另一个用户删除和添加，并且具有相同的ID，这是很好的。

您首先要侦听当前登录的用户user/${auth.id}，然后通过添加this.bindAsObject(ref, `note_${noteKeySnapshot.key()}`)来填充注释。然后，每次状态更新时：

 render () {
   let noteKeys = Object.keys(this.state)
   noteKeys = noteKeys.filter(k => k.search('note_') === 0)
   let notes = []
   for (let k in noteKeys) {
     notes.push(this.state[k])
   }
   return <div>
     {notes.map(n => <span>{note.created_at}</span>)}  // and so on
   </div>
}