How to get multiple id's from firebase?

Question

I have an admin area which collects all data from Firebase in an array. My task is to update data and send it to Firebase for specific users (I need to put some comment). Problem is that in .doc('id of document'), I don't know how to get the specific ID of document in Firebase. Function works fine if I put in an ID of a specific document (e.g. "2jzm4AcWTVNIlT9ESH7V"). doc.data() returns all the data from Firebase and each ID is stored in the object together with the data.

<script>
import moment from 'moment'
export default{
  // ...
  mounted(){
    db.collection("form").where("posted_at", ">=", 1)
      .get()
      .then(querySnapshot => {
        querySnapshot.forEach(doc=> {
          console.log(doc.id, " => ", doc.data());
          this.array.push(Object.assign({}, doc.data(), {id: doc.id}));
        });
      })
      .catch(function(error) {
        console.log("Error getting documents: ", error);
      });
  },
  methods:{
    comment(){
      let id=this.array.id;
      db.collection("form")
        .doc(id)
        .update({
          comment: this.comment1 //data(){return{comment1:''}}
        })
        .then(function() {
          console.log("Document successfully written!");
        })
        .catch(function(error) {
          console.error("Error writing document: ", error);
        });
    }
  }
};
</script>

P.S. i get this error for function:

FirebaseError: [code=invalid-argument]: Function CollectionReference.doc() requires its first argument to be of type non-empty string, but it was: undefined

Answer 1

The line let id=this.array.id; is trying to get the id property of the array itself, not the ID of an entry in the array.

Based on the YouTube tutorial you are following, when you attach your comment() method in the v-for loop, you should pass the array entry it relates to in as a parameter. When this method is invoked, it should set the ID that is being edited, load the existing comment (if it exists) and open the modal dialog to edit the comment.

<script>
export default{
  //...
  methods: {
    editComment(userDetails) {
      this.textComment = userDetails.comment || ''; // load current comment
      this.activeUserDetailsId = userDetails.id; // set ID being edited
      $('#commentModal').modal('show'); // show modal dialog
    },
    saveComment() {
      let id = this.activeUserDetailsId;
      if (!id) {
        alert('Failed to save comment - invalid state');
        return;
      }
      db.collection("form")
        .doc(this.activeUserDetailsId)
        .update({
          comment: this.textComment
        })
        .then(function() {
          $('#commentModal').modal('hide');
          console.log("Document successfully written!");
        })
        .catch(function(error) {
          // TODO: Show error to user
          console.error("Error writing document: ", error);
        });
    }
  }
};

I have edited, proofed and reworked the code you provided into this updated file. It was written free hand so let me know if there are any bugs.

A summary of the changes:

• Renamed variables to make their use clear
• Added editComment(userDetails) and saveComment() event handlers
• Fixed usage of formatTime filter from your other question
• Added basic handling of no results
• Fixed indentation
• Fixed incorrect placement of your modal div - shouldn't have been inside v-for loop