fix(Picker): should update modelValue immediately

This commit is contained in:
chenjiahan 2022-02-15 17:36:49 +08:00
parent 7deba88b91
commit e61bd487fa

View File

@ -12,6 +12,7 @@ import {
extend, extend,
unitToPx, unitToPx,
truthProp, truthProp,
isSameValue,
makeArrayProp, makeArrayProp,
preventDefault, preventDefault,
makeStringProp, makeStringProp,
@ -22,7 +23,6 @@ import {
} from '../utils'; } from '../utils';
import { import {
isOptionExist, isOptionExist,
isValuesEqual,
getColumnsType, getColumnsType,
findOptionByValue, findOptionByValue,
formatCascadeColumns, formatCascadeColumns,
@ -112,17 +112,24 @@ export default defineComponent({
) )
); );
const setValue = (index: number, value: string | number) => {
const newValues = selectedValues.value.slice(0);
newValues[index] = value;
selectedValues.value = newValues;
};
const onChange = (value: number | string, columnIndex: number) => { const onChange = (value: number | string, columnIndex: number) => {
selectedValues.value[columnIndex] = value; setValue(columnIndex, value);
if (columnsType.value === 'cascade') { if (columnsType.value === 'cascade') {
// reset values after cascading // reset values after cascading
selectedValues.value.forEach((value, index) => { selectedValues.value.forEach((value, index) => {
const options = currentColumns.value[index]; const options = currentColumns.value[index];
if (!isOptionExist(options, value, fields.value)) { if (!isOptionExist(options, value, fields.value)) {
selectedValues.value[index] = options.length setValue(
? options[0][fields.value.value] index,
: undefined; options.length ? options[0][fields.value.value] : undefined
);
} }
}); });
} }
@ -250,8 +257,7 @@ export default defineComponent({
options.length && options.length &&
!isOptionExist(options, selectedValues.value[index], fields.value) !isOptionExist(options, selectedValues.value[index], fields.value)
) { ) {
selectedValues.value[index] = setValue(index, getFirstEnabledOption(options)[fields.value.value]);
getFirstEnabledOption(options)[fields.value.value];
} }
}); });
}, },
@ -261,7 +267,7 @@ export default defineComponent({
watch( watch(
() => props.modelValue, () => props.modelValue,
(newValues) => { (newValues) => {
if (!isValuesEqual(newValues, selectedValues.value)) { if (!isSameValue(newValues, selectedValues.value)) {
selectedValues.value = newValues; selectedValues.value = newValues;
} }
}, },
@ -270,11 +276,11 @@ export default defineComponent({
watch( watch(
selectedValues, selectedValues,
(newValues) => { (newValues) => {
if (!isValuesEqual(newValues, props.modelValue)) { if (!isSameValue(newValues, props.modelValue)) {
emit('update:modelValue', selectedValues.value); emit('update:modelValue', selectedValues.value);
} }
}, },
{ deep: true } { immediate: true }
); );
useExpose<PickerExpose>({ confirm }); useExpose<PickerExpose>({ confirm });