firestoreのdb設計の修正

Question

現状dbが

messages-doc(userID)-userID
                    -doc(自動)-messages(サブコレクション)-doc(自動)-body                                                  
                                                             -date                                                  
                                                             -time

となっており、こちらを

messages-doc(userId)-userId
                    -body
                    -date
                    -time

となる様にdb設計の修正をしたいのですが、中々悪戦苦闘しております。。。

app/plugins/firebase.js21行目のuserIdさえapp/plugins/firebase.js43行目で取得できれば先へ進めそうなのですが、非同期処理の為うまく読み取ることができておりません。
ですので、VuexでuserIdを管理すれば良いと思い実装しようとしておりますが、そちらの実装も中々うまくできずストップしております。

今回そもそもVuexを使う必要があるのかどうかさえ分からず、暗中模索の中どの様にすれば上記のようなdbへ修正できるのかアドバイスを頂ければと思います????。。。
是非考え方だけでも参考にさせて頂きたいです。

GitHub

Answer 1

firebaseのUserIDはfirebase.auth.currentUserで取得できるので、DBを使用するページで
app/plugins/firebase.jsのdbをimportし、以下のようにすると動作するのかなと思います。（詳しく実装を見ていないのでこれでダメそうであればコメントください）
また、さらにきれいに書かなければいけないのであればuserIDを受け取ってdbオブジェクトを返すような関数を作ってもいいかもしれません。（見た限りそんなに汎用的に使うものではなさそうなのでいらない気もしています）

import { db, auth } from プラグインのfirebase.js

export default {
  methods: {
    async getMessages() {
      const uid = auth.currentUser
      if (uid) {
        const messages = await db.collection('messages').doc(uid).get()
      }  
    }
  }
}

Comments

[riki01]

ご返信ありがとうございます！
Main.vueで上記のコードを加えたところうまくuserIdを読み取ることができました！
あとはこれをMessage.jsで読み取れれば行けそうです！！
ただ、db上では以前と変わらずでした????

[unotovive]

良かったです。
db上では以前と変わらず、というのはどういった問題が発生しているのでしょうか...？

[riki01]

すみません、説明不足でした????
Main.vueでconsole.log(userId)をすることで値が渡っていることはunotoviveさんのおかげで解決できました！

しかし、この値(userId)をどの様にしてMessage.jsに渡せばいいかずっと苦戦しております????????
恐らくMessage.js32行目でadd()を使用しているため、doc(自動)が生成されていると思いますので、ここにdoc(userId).set(postData)をadd()の代わりに代入しようと思ってます！

しかし、Main.vueのuseIdが渡っていない為うまく表示されていない状態です。(特にエラーなど出ておらず、単にMain.vueからuserIdの値が渡っていないだけだと思いますが、ここに4日間苦戦しております????)

Answer 2

自己解決致しました。