javascriptのpushにうまく値を渡せない

Question

nuxtで下記のコードでmessagesに配列をpushしたく、そのなかの配列のuser_iconに値をうまく渡せません

  created() {
    const db = firebase.firestore()
    db.collection('room').doc(this.room_id).collection('message').onSnapshot(querySnapshot => {
      querySnapshot.docChanges().forEach(doc => {
        var user_icon_ref = db.collection("user").doc("userid")
        user_icon_ref.get().then(function (userdoc) {
          user_icon_url = userdoc.data()
        }),
        this.messages.push({
          ...doc.doc.data(),
          id: doc.doc.id,
          user_icon: user_icon_url.name
        })
      })
    })
  },

エラー文

ReferenceError: user_icon_url is not defined

Comments

[m.ts10806]

エラーの意味と原因自体は認識されてますよね？

[you88]

はい！

[m.ts10806]

質問内容からなにも調べてない感しか出ていなかったので。

Answer 1

user_icon_ref.get()が非同期で行われているため、thenに渡した関数内でしかuser_icon_urlにその値が入りません。thenに渡した関数内でpushを処理されては。

Comments

[you88]

できました！ありがとうございます！