如何实现Wix集合中两个日期字段的区间查询？

核心问题分析 #

你的代码存在三个关键问题：

• 错误复用查询对象：results.query是已执行查询的原始对象，无法直接追加条件并重新执行find()，二次查询的逻辑完全错误。
• 空值未处理导致报错：if判断用||，当其中一个日期选择器为空时（比如起始日期未选择），调用getFullYear()会直接抛出null对象的方法调用错误。
• 查询逻辑拆分不合理：先执行标题查询再过滤日期，不仅效率低，还会导致结果不准确。

修正后的代码 #

场景1：集合中startingDate和endingDate为Date类型字段

function search() {
    const titleKeyword = $w('#input11').value;
    const startDate = $w("#startingDatePicker").value;
    const endDate = $w("#endingDatePicker").value;

    // 初始化基础查询
    let query = wixData.query("Collection1");

    // 添加标题模糊匹配条件（如果有输入）
    if (titleKeyword) {
        query = query.contains("title", titleKeyword);
    }

    // 添加起始日期筛选（如果选择了日期）
    if (startDate) {
        // 构造当天0点整的Date对象，确保包含全天数据
        const startDateObj = new Date(startDate.getFullYear(), startDate.getMonth(), startDate.getDate(), 0, 0, 0);
        query = query.ge("startingDate", startDateObj);
    }

    // 添加结束日期筛选（如果选择了日期）
    if (endDate) {
        // 构造当天23:59:59的Date对象，确保包含全天数据
        const endDateObj = new Date(endDate.getFullYear(), endDate.getMonth(), endDate.getDate(), 23, 59, 59);
        query = query.le("endingDate", endDateObj);
    }

    // 执行最终查询并更新重复器
    query.find()
        .then(results => {
            $w('#repeater1').data = results.items;
            console.log("查询到的结果数量：", results.items.length);
        })
        .catch(err => {
            console.error("查询失败：", err);
        });
}

场景2：集合中startingDate和endingDate为MM/DD/YYYY格式的字符串字段

如果你的集合日期是字符串存储，需要先把日期选择器的Date对象转成对应格式的字符串，再进行比较：

// 新增日期格式化函数
function formatDateToMMDDYYYY(date) {
    const month = String(date.getMonth() + 1).padStart(2, '0');
    const day = String(date.getDate()).padStart(2, '0');
    const year = date.getFullYear();
    return `${month}/${day}/${year}`;
}

function search() {
    const titleKeyword = $w('#input11').value;
    const startDate = $w("#startingDatePicker").value;
    const endDate = $w("#endingDatePicker").value;

    let query = wixData.query("Collection1");

    if (titleKeyword) {
        query = query.contains("title", titleKeyword);
    }

    if (startDate) {
        const formattedStart = formatDateToMMDDYYYY(startDate);
        query = query.ge("startingDate", formattedStart);
    }

    if (endDate) {
        const formattedEnd = formatDateToMMDDYYYY(endDate);
        query = query.le("endingDate", formattedEnd);
    }

    query.find()
        .then(results => {
            $w('#repeater1').data = results.items;
        })
        .catch(err => {
            console.error("查询失败：", err);
        });
}

额外说明 #

你提到console.log输出的日期是英文格式，这是JavaScript Date对象默认的toString()输出，属于调试信息，不影响查询功能。如果需要在页面上显示中文格式的日期，再用上面的formatDateToMMDDYYYY函数或其他格式化方式处理即可。

内容的提问来源于stack exchange，提问作者Al.Y