[ToyProject]インクリメンタルオーバーロードサイト-7

:今日、計画通りにFirebaseにcollection、document、フィールド値などを作成し、モーションレコードを格納、表示、変更するロジックを作成します.実際、初めてNOSQL構造のDBを使うと、最初から配列やオブジェクトとしてデータを格納できる点が驚き(柔軟性の観点から)便利です.RDBMS(Mysqlなど)では、配列、リレーションシップの作成、外部キーリファレンスによるクエリーは不要ですが、FirebaseのCloudStoreではこれらのリレーションシップリファレンスは不要です(nosql構造であるため).

const completeWorkout = async () => {
    const date = moment().format("YYYY/MM/DD");
    var recordRef = await db.collection("records").doc(user.email);
    recordRef
      .get()
      .then((doc) => {
        if (doc.exists) {
          const data = doc.data()[date];
          if (data) {
            data.push(checkList);
            recordRef.set(
              {
                [date]: data,
              },
              { merge: true }
            );
          } else {
            recordRef.set({
              [date]: [checkList],
            });
          }
        } else {
          db.collection("records")
            .doc(user.email)
            .set({
              [date]: [checkList],
            });
        }
      })
      .catch((error) => {
        console.log("Error getting document:", error);
      });

    setCheckList({});
    history.push("/main");
  };

:以上のコードで、モーションレコード(1回)をcollectionに保存します.オブジェクトのキーをその日の日付に設定し、キーの値にその日のモーションの複数のトレーニングを格納し、後で受信または変更したときにハッシュ・テーブルのようにクエリーして書き込む配列を配置します.それぞれの電子メールをドキュメントの値として使用することを決定します.そこで、recordsページ(個人の動き記録を取得するページ)が完了しました.でも、ここで

の単字スクロールロジック(例えば、最近7日間のデータのみを受信)

.
作成

Reactローカルメニューバーによる記録ページ、練習ページ等の移動

検索機能などが必要な場合があります.たとえば、特定の日付を検索すると、日付がフィルタされます.これはUIでも実現していないので実現すべきです.

に質問
:今日ブログで振り返ってみると、日付はオブジェクトのキーなので、降順や昇順にソートするには、他の論理が必要だと思います.この部分も解決しなければなりません!我々の目標は,テンプレート機能を実装する前に1/1を達成することである.
next steps
クエリー

がデータを記録するときに昇順と降順で受信またはソートする方法

.

Reactローカルメニューバーを作成し、

を移動できます.

検索機能と日付フィルタUIと機能を実現する

記録データ検証

事実上、これはこの昇順降順問題に類似した問題であり、記録データ自体(状態端またはフロントで管理されているデータ)もオブジェクトであり、以前「架台圧力」、「斜面圧力」があった場合、まず順序架台圧力が発生し、これを修正すると、例えばv-upsに変更される.自動的に順番を変えて、UXが混乱する問題があります.これに対して解決しなければならない.