javascript - 循环遍历 ListView 以匹配日历 selectedDate

Question

我正在寻找填充 listView当前的事件数selectedDate包含来自数组的数据的日历 ( calendarListModel )

当从日历中选择新日期时，我需要更新列表，如果新选择的日期不存在任何事件，则清除列表并保持为空，或者用与新选择的日期匹配的新委托(delegate)替换 listView。

我的数组是从 Firebase 数据库读取数据创建的，它按预期工作。我的数组的一个例子是；

calendarListModel: [
    {"date":2019-02-12,"name":"user1"},
    {"date":2019-02-13","name":"user1"},
    {"date":2019-02-12,"name":"user2"}
]

如果我将模型设置为 calendarListModel我的列表显示每个数据库条目，无论 listView 上的日期如何.

我尝试过诸如此类的事情:

model: calendarListView.date(calendar.selectedDate

还使用循环来访问数据，但我没有成功，最近是以下示例；

function updateEvents() {
                    var eventModel = calendarListModel.find(
                                function(obj){
                                return obj.date === calendar.selectedDate.getDate(),
                                console.log(JSON.stringify(obj));
                                }
                            );
                    if (eventModel === undefined)
                        return eventListModel.length = [];
                    return eventListModel.push(eventModel)
                }

Calendar {
        id: calendar
        selectedDate: new Date()

        onSelectedDateChanged: {
            const day = selectedDate.getDate();
            const month = selectedDate.getMonth() + 1;
            const year = selectedDate.getFullYear();
            updateEvents()
        }
    }

            ListView {
            id:eventListView
            model: eventListModel
        }

我的控制台日志来自JSON.stringify(obj)似乎将我的数组分割成单独的对象，日志显示:

{"date":1549972800000,"name":"user1"}
{"date":1550059200000,"name":"user1"}
{"date":1549972800000,"name":"user2"}

但是当这样做时eventListView和eventModel保持空白？

我可以做什么来纠正这个问题或者我需要朝什么方向努力？

Answer 1

您传递给 find 的函数有错误。

function(obj) {
    return obj.date === calendar.selectedDate.getDate(),     // <-- oh no! lé comma!
        console.log(JSON.stringify(obj));
}

请注意，您使用了逗号运算符，在 JS 中，它将丢弃左侧的表达式并返回右侧的结果(此处为 undefined ，因为这就是 console.log 返回)。在 JS 控制台上的快速测试表明，这不会产生并返回所需的结果(在您的情况下为 bool 值)。

function comma() {
    return 1, console.log('blunder');
}
function noComma {
    console.log('success');
    return 1;
}

x = comma();    // blunder
y = noComma();  // success

console.log(x);  // undefined   //  but expected 1 ?!?
console.log(y);  // 1

您可能正在追求这样的东西:

function(obj) {
    console.log(JSON.stringify(obj));

    return obj.date === calendar.selectedDate.getDate();
}

但是，这会将...字符串 (?) 与整数(由 getDate() 返回)进行比较。您可能想要这样做

return new Date(obj.date).getDate() === calendar.selectedDate.getDate();

这仍然会在返回 bool 值时记录 obj。

Read more about JavaScript's comma operator...