Question

调整后更新

因此，从建议中修改代码并使用图像的可见性并将日期推送到数组后，我仍然看不到单独标记的日期，我的新代码是：

    property var arrayFromFirebase: []

onFirebaseReady: {
          firebaseDb.getUserValue("dates", {
                                      orderByChild: true
                        }, function(success, key, value) {
                                  if(success) {
                                      console.log(JSON.stringify(value))
                                for( date in value){arrayFromFirebase.push(date.date)}
                                      }
                              })
      }

Image {
       visible: arrayFromFirebase.indexOf(styleData.date.getDate()) > -1
       }

我的日志仍然以以下格式读取arrayFromFirebase：

[{"date":"2018-10-01T21:17:00.926"},{"date":"2018-10-02T12:00:00.000"},{"date":"2018-10-03T12:00:00.000"},{"date":"2018-10-06T12:00:00.000"},{"date":"2018-10-07T12:00:00.000"},{"date":"2018-10-08T12:00:00.000"}]

原始问题

我有一个日历，我的用户可以将选定的日期保存在Firebase中，日历是通过链接中的示例构建的

QtQuick Calendar

我的用户日期存储在Firebase中，当我读取它们时，可以使用JSON.stringify在日志中接收它们，

将保存的日期写入数据库时，我使用以下代码：

    property var userData: {      
  "selectedDates": [         
        { },
      ]
}

  AppButton {
      id: saveButton
      text: "Save & Request"
      anchors.right: parent.right
      textColor: "#4e4e4e"
      backgroundColor: "#d1d1d1"
      onClicked: {
        userData.selectedDates.push({ "date": calendar.selectedDate});
        console.log(JSON.stringify(userData));
        firebaseDb.setUserValue("dates", userData.selectedDates)
      }
  }

然后在阅读日期时，我将使用以下内容：

  FirebaseDatabase {
      config: customConfig
      onFirebaseReady: {
          firebaseDb.getUserValue("dates", {
                                      startAt: {
                                          Key: "1/date",
                                      }
                        }, function(success, key, value) {
                                  if(success) {
                                      console.log(JSON.stringify(value))
                                      }
                              })
      }
  }

读取后，日志将显示以下日期：

[{"date":"2018-10-01T21:17:00.926"},{"date":"2018-10-02T12:00:00.000"},{"date":"2018-10-03T12:00:00.000"},{"date":"2018-10-06T12:00:00.000"},{"date":"2018-10-07T12:00:00.000"},{"date":"2018-10-08T12:00:00.000"}]

我想使用这串日期并将标记添加到我的日历中以显示已被预订吗？

我将如何处理？

记录here的类型FirebaseDatabase

日历QML代码

CalendarQMLCode

Answer 1

更新（在@derM评论之后）

无需使用sqlite数据库模型

就在dayDelegate中，我们使用事件指示器图像 visibility

为此，从firebase获取数据后，将其保存到一个数组（我们将其命名为arrayFromFireBase），然后检查styleData.date是否在该数组中

FirebaseDatabase {
  config: customConfig
  onFirebaseReady: {
      firebaseDb.getUserValue("dates", {
                                  startAt: {
                                      Key: "1/date",
                                  }
                    }, function(success, key, value) {
                              if(success) {
                                  console.log(JSON.stringify(value))
                                  // value here is JSON ARRAY
                                  // value =[{"date":"2018-10-01T21:17:00.926"},{"date":"2018-10-02T12:00:00.000"}]
                                  // so value[0].date ="2018-10-01T21:17:00.926"
                                  //then you gonna insert here your dates in arrayFromFireBase as strings as follow
                                  for(i=0 ; i < arrayFromFireBase.length-1 ; i++) 
                                    arrayFromFireBase.push(new Date(value[i].date).getTime())
                                  }
                          })
  }
}
Calendar {
    ...
    style: CalendarStyle {
        dayDelegate: Item {
            ...
            Image {
                // HERE WE MUST COMPARE TIME (we used Date.getTime()) FROM FIREBASE with the calendar's date converted to time also 
                visible: arrayFromFireBase.indexOf(styleData.date.getTime()) > -1
                ...
                source: "qrc:/images/eventindicator.png"
            }
        }
    }
}

旧答案

部分代码摘自Qt Quick Controls - Calendar Example

只需添加void SqlEventModel::insertDates(QStringList dates)

C ++部分

SqlEventModel::SqlEventModel()
{
 createConnection();
}

void SqlEventModel::createConnection()
{
 QSqlDatabase db = QSqlDatabase::addDatabase("QSQLITE");
 db.setDatabaseName(":memory:");
 if (!db.open()) {
     qFatal("Cannot open database");
     return;
 }
}
void SqlEventModel::insertDates(QStringList dates){
 QSqlQuery query;
 // We store the time as seconds because it's easier to query.
 // It depends on what you want as columns for your events
 query.exec("create table Event (name TEXT, startDate DATE, startTime INT, 
  endDate DATE, endTime INT)");
 foreach(QString date in dates){

  // It depends on what you want as columns for your events
  query.exec(QString("insert into Event values('%1', '%2', 
  %3, '%4', %5)").arg(date[0]).arg(date[1]).arg(date[2]).arg(date[3]).arg(date[4]));
 }
 return;
}

QML部分

SqlEventModel {
 id: eventModel
}

FirebaseDatabase {
  config: customConfig
  onFirebaseReady: {
      firebaseDb.getUserValue("dates", {
                                  startAt: {
                                      Key: "1/date",
                                  }
                    }, function(success, key, value) {
                              if(success) {
                                  console.log(JSON.stringify(value))
                                  //Insert here your dates in sql model
                                  eventModel.insertDates(value)
                                  }
                          })
  }
}

Answer 2

因此，在开发假期后，我有一个可行的解决方案！因此，请参见下文（不包括所有多余的代码），并感谢大家的帮助！（尤其是@Redanium，请耐心等待）

Main.qml:
App {

    property var arrayFromFireBase: []

 onLoggedIn:  {
      firebaseDb.getUserValue("dates/selectedDates", {},
                                    function(success, key, value) {
                                    if(success) {
                                         for(var idx in value)
                                            arrayFromFireBase.push(new Date(value[idx].date).getTime())
                                    })}}

然后在我的日历页面上显示以下内容：

CalendarPage.qml:

Page {
AppButton {
          id: saveButton
          text: "Save & Request"
              onClicked: {
                  userData.selectedDates.push({"date": calendar.selectedDate});
                  console.log(JSON.stringify(userData));
                  firebaseDb.setUserValue("dates", userData)
                  }
           }

property var userData: { 
            "selectedDates": [{}]
           }

Image {
       visible: arrayFromFireBase.indexOf(styleData.date.getTime()) > -1
      }
}

将日期字符串添加到qml日历

2 个答案: