//tips
//smart contract
Firebaseへdatabaseを作成しアクセスできるようにしていく。
コレクションid:mydata
この中に各ドキュメントを作成していく。age,mail,nameのフィールドを作成した。
昨日firebaseの初期化設定はfirebase.jsに行っている。バージョンアップの影響を受けているのでデータベースのnext連動は慎重にいく。
Apptest.jsの中にimport { getFirestore } from "firebase/firestore”を組み込み、
const firestore = getFirestore(firebaseApp)
でデータベース取得。
const [books, setBooks] = useState([])
useEffect(() => {
const firestore = getFirestore(firebaseApp)
}, [])
ここからコレクションを指定して操作を行えるようにする。
import { collection, getDocs } from "firebase/firestore"
collection を使って、Firestore Database のコレクションを呼び出し。第一引数にはfirestore、第二引数にはコレクション名を指定。
const firestore = getFirestore(firebaseApp)
const docRef = collection(firestore, "mydata")
getDocsを使って、データを取得。
最終的にコレクションの取得データは下記のようにして全て表示させることができた。
const [books, setBooks] = useState([])
useEffect(() => {
const firestore = getFirestore(firebaseApp)
const docRef = collection(firestore, "mydata")
getDocs(docRef).then(res => {
let results = []
res.docs.forEach(doc => {
results.push({ id: doc.id, ...doc.data() })
})
setBooks(results)
})
}, [])
<div>
{books[0] ? (
books.map(book => (
<div key={book.id}>
<p>{book.name}</p>
<p>{book.mail}</p>
<p>{book.age}</p>
</div>
))
) : (
<p>データがありません</p>
)}
</div>
現在全てのドキュメントを取得しているのでその中の一部を抜き出せるようにしていく。
FirebaseError: Invalid collection reference. Collection references must have an odd number of segments, but mydata/1 has 2.
Collection Reference will have odd number of segment, Document Reference will have even number of segment.
Firestore data structure are: Collection - document - Collection - document - Collection - document
https://stackoverflow.com/questions/46639058/firebase-cloud-firestore-invalid-collection-reference-collection-references-m
https://firebase.google.com/docs/firestore/data-model#hierarchical-data
https://stackoverflow.com/questions/54685662/error-in-flutter-document-references-must-have-an-even-number-of-segments
こちらもエラー。
const docRef = doc(firestore, "mydata","1")//第3引数にドキュメントの値
コレクションから複数のドキュメントを取得するのでwhereを使用してしまえば良いか。
https://firebase.google.com/docs/firestore/query-data/get-data?hl=ja
FirebaseError: Expected type 'rc', but it was: a custom oc object
ドキュメントとフィールドの区分けがうまくいかないのではないか。
どうも単一ドキュメントの抜き出しがうまくいかない。
useEffect(() => {
const firestore = getFirestore(firebaseApp)
const getBook = async () => {
const docRef = collection(firestore, "mydata").document("1").getDocument()
//const mydataRef = collection(firestore, "mydata");
//const docRef = query(mydataRef, where('id', 'in', ['1']));
//const docRef = query(collection(firestore, "mydata"),where("age","==","39"))
// const docRef = doc(firestore, "mydata","1")//第3引数にドキュメントの値
//const docRef = collection(firestore, "mydata","abc")//第3引数にドキュメントの値
//console.log(docRef)
const docSnap = await getDocs(docRef)
console.log(docSnap)
setBooks(docSnap)
}
getBook()
console.log(books)
}, [])
むむ、一旦firebaseを掘り下げる。