无法修改duet-date-picker日期格式的技术求助

你的代码存在两个关键错误，导致日期格式修改失败，修正后即可正常生效：

1. 正则表达式语法错误 #

正则末尾的n是无效修饰符，直接删除即可。正确的正则应为：

const DATE_FORMAT_US = /^(\d{1,2})\/(\d{1,2})\/(\d{4})$/

2. 日期解析的月份索引问题 #

JavaScript的Date对象月份以0为起始（0代表1月，11代表12月），但正则匹配到的月份是1-12的数值，因此传给createDate时需要减1，否则会导致月份偏移（比如选择6月会变成7月）。

同时，为了兼容初始的YYYY-MM-DD格式输入，parse方法需要额外处理这种情况，避免初始值无法正确解析。

修正后的完整代码 #

<duet-date-picker name="date" language="en" label="Choose a date" placeholder="mm/dd/yyyy" value="2020-06-16"></duet-date-picker>

<script>
    const picker = document.querySelector("duet-date-picker")
    const DATE_FORMAT_US = /^(\d{1,2})\/(\d{1,2})\/(\d{4})$/
    const DATE_FORMAT_ISO = /^(\d{4})-(\d{1,2})-(\d{1,2})$/

    picker.dateAdapter = {
        parse(value = "", createDate) {
            // 优先匹配MM/DD/YYYY格式
            const usMatches = value.match(DATE_FORMAT_US)
            if (usMatches) {
                // 月份减1适配Date对象的索引规则
                return createDate(usMatches[3], usMatches[1] - 1, usMatches[2])
            }

            // 兼容默认的YYYY-MM-DD格式，确保初始值正常显示
            const isoMatches = value.match(DATE_FORMAT_ISO)
            if (isoMatches) {
                return createDate(isoMatches[1], isoMatches[2] - 1, isoMatches[3])
            }

            return null
        },
        format(date) {
            // 补零保证月份和日期为两位数字，格式更统一
            const month = String(date.getMonth() + 1).padStart(2, '0')
            const day = String(date.getDate()).padStart(2, '0')
            return `${month}/${day}/${date.getFullYear()}`
        },
    }

    picker.localization = {
        buttonLabel: "Choose date",
        placeholder: "mm/dd/yyyy",
        selectedDateMessage: "Selected date is",
        prevMonthLabel: "Previous month",
        nextMonthLabel: "Next month",
        monthSelectLabel: "Month",
        yearSelectLabel: "Year",
        closeLabel: "Close window",
        calendarHeading: "Choose a date",
        dayNames: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
        monthNames: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
        monthNamesShort: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
        locale: "en-US",
    }
</script>

额外优化说明 #

• 给月份和日期补零，确保输出格式统一为两位数字（如06/16/2020而非6/16/2020）。
• 兼容默认ISO格式解析，保证初始值2020-06-16能正确转换为目标格式显示。

内容的提问来源于stack exchange，提问作者vaibhav kamthe