我收到 Unhandled Promise Rejection 错误和一些数据结构建议 [关闭]

Question

我正在尝试在具有自动文档 ID 的餐厅文档下创建一个新集合。我的新路径将是 /restaurants/restaurant（具有自动生成的 doc id 的文档）/我的新集合
我在这一行出现错误

db.collection('restaurants').doc(doc.id).add( {

这是我的代码

   <script>
        import PictureInput from 'vue-picture-input'
        import firebase from 'firebase';
        require('@/firebase/init')
        const db = firebase.firestore()
        export default {
          name: 'Newentry',
          data() {
            return {
              menuTitle: null,
              foodName: null,
              menuItemDescription: null,
              menuItemInfo: null,
              inputCalories: null,
              image: null,
              imageURL: null,
              feedback: null
            }
          },
          components: {
            PictureInput
          },
          methods: {
            onChanged() {
              if(this.$refs.pictureInput.file) {
                this.image = this.$refs.pictureInput.file
              } else {
                console.log("Please add image")
              }
            },
            onRemoved() {
             this.image = ''
            },
            addFood() {
              if(!this.menuTitle) {
                this.feedback = "Please enter a menu title in Menu Section Name"
              } else if(!this.foodName) {
                this.feedback = "Please enter a food name in Menu Item Name"
              } else if(!this.menuItemDescription) {
                this.feedback = "Please enter a description in Menu Item Description"
              } else if(!this.menuItemInfo) {
                this.feedback = "Please enter an info in Menu Item Info"
              } else if(!this.inputCalories) {
                this.feedback = "Please enter calory in Calorie"
              } else if (!this.image) {
                this.feedback = "Please add a photo"
              } else {
                this.feedback = null
                // set and upload image to database and get its url
                 const storageRef=firebase.storage().ref(`${this.image.name}`).put(this.image)
                 storageRef.snapshot.ref.getDownloadURL().then((url) => {
                   this.imageURL = url
                 })

                // get current user
                let user = firebase.auth().currentUser
                // find restaurant that same ownerid
                db.collection('restaurants').where('ownerID', '==', user.uid).get()
                .then(snapshot => {
                  snapshot.forEach((doc) => {
                    db.collection('restaurants').doc(doc.id).add( {
                      foodLine: {
                        menuTitle: this.menuTitle
                      },
                      food: {
                        foodName: this.foodName,
                        menuItemDescription: this.menuItemDescription,
                        menuItemInfo: this.menuItemInfo,
                        inputCalories: this.inputCalories,
                        imageURL: this.imageURL
                      }
                    }).then(() => {
                      this.menuTitle = ''
                      this.foodName = ''
                      this.menuItemDescription = ''
                      this.menuItemInfo = ''
                      this.inputCalories = ''
                      this.image = ''
                    }).catch(err => {
                      console.log(err)
                    })
                  })
                })
              }
            }
          }

        }
        </script>

我搜索论坛，但没有一个能解决我的问题。

Answer 1

你的代码有几点需要修改：

1。 add() 是 CollectionReference 的一个方法

add() 方法将在 CollectionReference 上调用，而不是在 DocumentReference 上调用。

由于您希望新文档具有路径“/restaurants/restaurant（具有自动生成的文档 ID 的文档）/我的新集合”，您需要这样做：

db.collection('restaurants').doc(doc.id).collection("my_new_collection").add()

2。您应该考虑用户的餐厅文档数量

您没有指定给定用户是否可以拥有一个或多个餐馆文档（换句话说，db.collection('restaurants').where('ownerID', '==', user.uid) 查询将返回多少个文档）。

如果对于给定用户，查询仅返回 ONE 餐厅，您可以按如下方式调整您的代码：

db.collection('restaurants').where('ownerID', '==', user.uid).get()
.then(snapshot => {   //This is a QuerySnapshot
    return snapshot.docs[0].ref.collection("my_new_collection").add(...);
}).then(() => {
    this.menuTitle = '';
    //...
}).catch(err => {
    console.log(err);
})

另一方面，如果查询可能返回多个文档，最好如下使用Promise.all()，以便正确链接异步方法返回的promise： p>

db.collection('restaurants').where('ownerID', '==', user.uid).get()
.then(snapshot => {   
    const promises = [];
    snapshot.forEach((doc) => {
        promises.push(doc.ref.collection("my_new_collection").add(...));
    })
    return Promise.all(promises);
}).then(result => {
    this.menuTitle = '';
    //...
}).catch(err => {
    console.log(err);
})

请注意，您可以使用batched write，而不是使用Promise.all()。与Promise.all() 的一个不同之处在于，一批写入以原子方式完成。