fix(DateTimePicker): fix incorrecrt inital value (#8193)

This commit is contained in:
nemo-shen 2021-02-25 09:48:38 +08:00 committed by GitHub
parent 433b9e1bf7
commit 97e0414a8f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 70 additions and 9 deletions

View File

@ -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;
} }
} }

View 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);
});