引言

很快來到一個尾聲
那就開始吧
今天會做一個標籤樣式的功能
為我們的書單上建立Tags
而且要可以複選

Firebase 控制台

先為我們另外的標籤資料
設定權限
加上以下

   match /bookTags/{document=**} {
  		allow read, write: if request.time < timestamp.date(2023, 10, 20);
		}

來一隻API

來到檔案firebase.ts

export const getBookTags = async () => {
  const collectionRef = collection(db, "bookTags");
  const orderedQuery = query(collectionRef, orderBy("title"));
  const queryDocs = await getDocs(orderedQuery);
  const results: DocumentData = [];
  if (queryDocs.empty) {
    return results;
  }

  queryDocs.docs.forEach((doc) => {
    const data = doc.data();
    const id = doc.id;
    const folder = { id, ...data }; 
    results.push(folder);
  
  });
  return results;
};

我們定義了非同步函數 getBookTags
並且也會把它做成非同步元件
從 Firebase 的 Firestore 資料庫中的 bookTagscollection
按照 title欄位排序並返回

最後

我們可以用到上一章節用到的方式複習一下
這樣就完成囉^^