Layui 年选择器回调函数使用注意事项

在使用 Layui 的 laydate 组件时，开发者经常会遇到关于回调函数触发时机的问题。特别是当年选择器(type: 'year')与日期选择器(type: 'date')的行为差异，容易引起混淆。

回调函数的区别

Layui 的 laydate 组件提供了多个回调函数，其中最重要的两个是：

1. change 回调：在日期值发生变化时触发
2. done 回调：在选择完成并确认时触发

对于常规的日期选择器(type: 'date')，当用户点击选择日期时，会先触发 change 回调，然后在点击确定按钮时触发 done 回调。

年选择器的特殊行为

当年选择器(type: 'year')被使用时，其行为与日期选择器有显著不同：

1. 即时选择：点击年份即表示完成选择，没有额外的确认步骤
2. 回调触发：只会触发 done 回调，不会触发 change 回调
3. 值更新：选中的年份会立即更新到输入框中

这种设计符合年选择器的使用场景，因为用户通常只需要选择一个年份，不需要像日期选择那样有多次调整的机会。

最佳实践建议

1. 如果需要在选择年份后执行操作，应该使用 done 回调而不是 change 回调
2. 对于需要监听值变化的场景，可以考虑结合 input 事件监听
3. 理解不同选择器类型的交互差异，避免假设所有类型的行为一致

示例代码

laydate.render({
    elem: "#annual",
    type: "year",
    done: function(value, date) {
        console.log("选择的年份:", value);
        // 在这里执行选择后的操作
    }
});

通过理解这些差异，开发者可以更有效地使用 Layui 的日期选择组件，避免回调函数不触发的困惑。