mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-23 18:00:27 +08:00
fix(DateTimePicker): fix incorrecrt inital value (#8193)
This commit is contained in:
parent
433b9e1bf7
commit
97e0414a8f
@ -60,7 +60,8 @@ export default createComponent({
|
|||||||
);
|
);
|
||||||
return new Date(timestamp);
|
return new Date(timestamp);
|
||||||
}
|
}
|
||||||
return props.minDate;
|
|
||||||
|
return undefined;
|
||||||
};
|
};
|
||||||
|
|
||||||
const picker = ref<ComponentInstance>();
|
const picker = ref<ComponentInstance>();
|
||||||
@ -106,12 +107,12 @@ export default createComponent({
|
|||||||
const ranges = computed(() => {
|
const ranges = computed(() => {
|
||||||
const { maxYear, maxDate, maxMonth, maxHour, maxMinute } = getBoundary(
|
const { maxYear, maxDate, maxMonth, maxHour, maxMinute } = getBoundary(
|
||||||
'max',
|
'max',
|
||||||
currentDate.value
|
currentDate.value || props.minDate
|
||||||
);
|
);
|
||||||
|
|
||||||
const { minYear, minDate, minMonth, minHour, minMinute } = getBoundary(
|
const { minYear, minDate, minMonth, minHour, minMinute } = getBoundary(
|
||||||
'min',
|
'min',
|
||||||
currentDate.value
|
currentDate.value || props.minDate
|
||||||
);
|
);
|
||||||
|
|
||||||
let result: Array<{ type: ColumnType; range: number[] }> = [
|
let result: Array<{ type: ColumnType; range: number[] }> = [
|
||||||
@ -191,7 +192,7 @@ export default createComponent({
|
|||||||
);
|
);
|
||||||
|
|
||||||
const updateColumnValue = () => {
|
const updateColumnValue = () => {
|
||||||
const { value } = currentDate;
|
const value = currentDate.value || props.minDate;
|
||||||
const { formatter } = props;
|
const { formatter } = props;
|
||||||
|
|
||||||
const values = originColumns.value.map((column) => {
|
const values = originColumns.value.map((column) => {
|
||||||
@ -236,7 +237,7 @@ export default createComponent({
|
|||||||
let month;
|
let month;
|
||||||
let day;
|
let day;
|
||||||
if (type === 'month-day') {
|
if (type === 'month-day') {
|
||||||
year = currentDate.value.getFullYear();
|
year = (currentDate.value || props.minDate).getFullYear();
|
||||||
month = getValue('month');
|
month = getValue('month');
|
||||||
day = getValue('day');
|
day = getValue('day');
|
||||||
} else {
|
} else {
|
||||||
@ -265,6 +266,7 @@ export default createComponent({
|
|||||||
};
|
};
|
||||||
|
|
||||||
const onConfirm = () => {
|
const onConfirm = () => {
|
||||||
|
emit('update:modelValue', currentDate.value);
|
||||||
emit('confirm', currentDate.value);
|
emit('confirm', currentDate.value);
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -288,8 +290,8 @@ export default createComponent({
|
|||||||
|
|
||||||
watch(columns, updateColumnValue);
|
watch(columns, updateColumnValue);
|
||||||
|
|
||||||
watch(currentDate, (value) => {
|
watch(currentDate, (value, oldValue) => {
|
||||||
emit('update:modelValue', value);
|
emit('update:modelValue', oldValue ? value : null);
|
||||||
});
|
});
|
||||||
|
|
||||||
watch(
|
watch(
|
||||||
@ -302,7 +304,7 @@ export default createComponent({
|
|||||||
(value) => {
|
(value) => {
|
||||||
value = formatValue(value);
|
value = formatValue(value);
|
||||||
|
|
||||||
if (value.valueOf() !== currentDate.value.valueOf()) {
|
if (value && value.valueOf() !== currentDate.value?.valueOf()) {
|
||||||
currentDate.value = value;
|
currentDate.value = value;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
59
src/datetime-picker/test/index.spec.js
Normal file
59
src/datetime-picker/test/index.spec.js
Normal file
@ -0,0 +1,59 @@
|
|||||||
|
import {later, mount, triggerDrag} from "../../../test"
|
||||||
|
import DatePicker from "../DatePicker"
|
||||||
|
|
||||||
|
test('month-day type', async () => {
|
||||||
|
const date = new Date(2020, 10, 1, 0, 0);
|
||||||
|
|
||||||
|
const wrapper = mount(DatePicker, {
|
||||||
|
props: {
|
||||||
|
type: 'month-day',
|
||||||
|
modelValue: date,
|
||||||
|
minDate: new Date(2020, 0, 1),
|
||||||
|
maxDate: new Date(2025, 10, 1),
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
await later();
|
||||||
|
wrapper.find('.van-picker__confirm').trigger('click');
|
||||||
|
expect(wrapper.emitted('confirm')[0][0].getMonth()).toEqual(10);
|
||||||
|
expect(wrapper.emitted('confirm')[0][0].getDate()).toEqual(1);
|
||||||
|
|
||||||
|
await later();
|
||||||
|
triggerDrag(wrapper.find('.van-picker-column'), 0, -300);
|
||||||
|
wrapper.find('.van-picker__confirm').trigger('click');
|
||||||
|
expect(wrapper.emitted('confirm')[1][0].getMonth()).toEqual(11);
|
||||||
|
expect(wrapper.emitted('confirm')[1][0].getDate()).toEqual(1);
|
||||||
|
|
||||||
|
await later();
|
||||||
|
triggerDrag(wrapper.findAll('.van-picker-column')[1], 0, -300);
|
||||||
|
wrapper.find('.van-picker__confirm').trigger('click');
|
||||||
|
expect(wrapper.emitted('confirm')[2][0].getMonth()).toEqual(11);
|
||||||
|
expect(wrapper.emitted('confirm')[2][0].getDate()).toEqual(31);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('v-model', async () => {
|
||||||
|
const minDate = new Date(2030, 0, 0, 0, 3);
|
||||||
|
|
||||||
|
const wrapper = mount(DatePicker, {
|
||||||
|
props: {
|
||||||
|
minDate,
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
await later();
|
||||||
|
wrapper.find('.van-picker__confirm').trigger('click');
|
||||||
|
expect(wrapper.emitted('confirm')[0][0]).toEqual(minDate);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('value has an inital value', async () => {
|
||||||
|
const defaultValue = new Date(2020, 0, 0, 0, 0);
|
||||||
|
const wrapper = mount(DatePicker, {
|
||||||
|
propsData: {
|
||||||
|
modelValue: defaultValue,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
await later();
|
||||||
|
wrapper.find('.van-picker__confirm').trigger('click');
|
||||||
|
expect(wrapper.emitted('confirm')[0][0]).toEqual(defaultValue);
|
||||||
|
});
|
Loading…
x
Reference in New Issue
Block a user