teratail header banner
teratail header banner
質問するログイン新規登録
Vue.js

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

Firebase

Firebaseは、Googleが提供するBasSサービスの一つ。リアルタイム通知可能、並びにアクセス制御ができるオブジェクトデータベース機能を備えます。さらに認証機能、アプリケーションのログ解析機能などの利用も可能です。

Vuex

Vuexは、Vue.js アプリケーションのための状態管理ライブラリです。アプリケーション内で使用するコンポーネントのための集中データストアを提供。コンポーネント同士でデータをやり取りし、処理のフローを一貫させたり、データの見通しを良くすることができます。

Cloud Firestore

Cloud Firestore は、自動スケーリングと高性能を実現し、アプリケーション開発を簡素化するように構築された NoSQLドキュメントデータベースです。

Q&A

解決済

1回答

2389閲覧

[CloudFirestore]データ一覧取得方法

shoooota

総合スコア13

Vue.js

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

Firebase

Firebaseは、Googleが提供するBasSサービスの一つ。リアルタイム通知可能、並びにアクセス制御ができるオブジェクトデータベース機能を備えます。さらに認証機能、アプリケーションのログ解析機能などの利用も可能です。

Vuex

Vuexは、Vue.js アプリケーションのための状態管理ライブラリです。アプリケーション内で使用するコンポーネントのための集中データストアを提供。コンポーネント同士でデータをやり取りし、処理のフローを一貫させたり、データの見通しを良くすることができます。

Cloud Firestore

Cloud Firestore は、自動スケーリングと高性能を実現し、アプリケーション開発を簡素化するように構築された NoSQLドキュメントデータベースです。

0グッド

0クリップ

投稿2020/01/27 13:03

編集2020/01/27 13:30

0

0

vue.js、firestoreを使用してtodoリストを作成しています。
firestoreには、

match /users/{userId}/tasks/{taskId}

のパスでタスクを保存しています。
ここで、{taskId}内に保存されている全ての(全userIdの)データを取り出したいのですが、{userId}の一覧までしか取得できません。
全userIdのタスクを取得するには、どのようにすれば良いのでしょうか。

==試したこと

javascript

1firebase.firestore() 2 .collection("users") 3 .get() 4 .then(function(querySnapshot) { 5 querySnapshot.forEach(function(doc) { 6 console.log(doc.id, " => ", doc.data()); 7 }); 8 })

doc.idではuserIdが取得できました。
しかし、それ以降を取得する方法が分からず・・・・

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

全てのuserIdリストが取得できていますので、
そのuserIdのループの中でユーザーごとのtasksをひとつずつ取得していけばよいのかな、とおもいます
イメージ説明

取得したuserId(doc.id)を使ってusersの中のドキュメントを指定して、さらにその中にあるtasksコレクションを指定する感じです

firebase.firestore() .collection("users") .document(doc.id) .collection("tasks") .get

投稿2020/02/01 03:08

daisuken

総合スコア76

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

shoooota

2020/02/03 12:38

daiseken様 丁寧な解説ありがとうございました! 図のおかげで理解がしやすかったです。 一つ質問なのですが、doc.idには配列でidが入ってきていました。 そこで、参考で用意してくださった「tasksコレクションを指定する」方法の場合は、 for文等でループさせ、documentを指定するやり方で正しいでしょうか。 初歩的な質問ですみません。
daisuken

2020/02/03 13:26

そうですね、このループの中でdoc.idがひとつずつconsole.logで出力できているのではないかとおもいます。 querySnapshot.forEach(function(doc) { console.log(doc.id, " => ", doc.data()); }); 出力できているようでしたら、同じこのループの中でdocumentを指定するやり方で取得するとできるかなとおもいます
shoooota

2020/02/03 14:00

doc.idを取得できているループ内で documentを指定するやり方を実行してみました。 実行スクイプト> firebase .firestore() .collection("users") .get() .then(function(querySnapshot) { querySnapshot.forEach(function(doc) { firebase .firestore() .collection("users") .document(doc.id) .collection("tasks").get; }); }); 実行すると、 firebase__WEBPACK_IMPORTED_MODULE_7___default.a.firestore(...).collection(...).document is not a function となってしまいました。。。 しかし、ロジックは丁寧に解説していただいたのでなんとなく理解できました!
daisuken

2020/02/03 14:21

失礼しました、、javadcriptでdocumentを指定するAPIは doc でした。。 あとは、getの部分の記述の仕方も、doc.idを取得しているところと同じようにする必要があります! そのあたりはFiestoreの公式サイトのサンプルで説明されておりますので、がんばってください!
shoooota

2020/02/03 14:24

無事取得できました! 丁寧に解説してくださり本当にありがとうございました!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.30%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問