mirror of
https://github.com/vbenjs/gf-vben-admin.git
synced 2025-02-03 03:32:59 +08:00
fix(api-select): ensure that the onchange function parameters are correct
This commit is contained in:
parent
a2a75a097f
commit
fa64fc8a62
@ -2,6 +2,7 @@
|
|||||||
<Select
|
<Select
|
||||||
@dropdownVisibleChange="handleFetch"
|
@dropdownVisibleChange="handleFetch"
|
||||||
v-bind="attrs"
|
v-bind="attrs"
|
||||||
|
@change="handleChange"
|
||||||
:options="getOptions"
|
:options="getOptions"
|
||||||
v-model:value="state"
|
v-model:value="state"
|
||||||
>
|
>
|
||||||
@ -67,11 +68,12 @@
|
|||||||
const options = ref<OptionsItem[]>([]);
|
const options = ref<OptionsItem[]>([]);
|
||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
const isFirstLoad = ref(true);
|
const isFirstLoad = ref(true);
|
||||||
|
const emitData = ref<any[]>([]);
|
||||||
const attrs = useAttrs();
|
const attrs = useAttrs();
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
|
|
||||||
// Embedded in the form, just use the hook binding to perform form verification
|
// Embedded in the form, just use the hook binding to perform form verification
|
||||||
const [state] = useRuleFormItem(props);
|
const [state] = useRuleFormItem(props, 'value', 'change', emitData);
|
||||||
|
|
||||||
const getOptions = computed(() => {
|
const getOptions = computed(() => {
|
||||||
const { labelField, valueField, numberToString } = props;
|
const { labelField, valueField, numberToString } = props;
|
||||||
@ -135,7 +137,11 @@
|
|||||||
emit('options-change', unref(options));
|
emit('options-change', unref(options));
|
||||||
}
|
}
|
||||||
|
|
||||||
return { state, attrs, getOptions, loading, t, handleFetch };
|
function handleChange(_, ...args) {
|
||||||
|
emitData.value = args;
|
||||||
|
}
|
||||||
|
|
||||||
|
return { state, attrs, getOptions, loading, t, handleFetch, handleChange };
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
@ -1,12 +1,22 @@
|
|||||||
import type { UnwrapRef } from 'vue';
|
import type { UnwrapRef, Ref } from 'vue';
|
||||||
import { reactive, readonly, computed, getCurrentInstance, watchEffect } from 'vue';
|
import {
|
||||||
|
reactive,
|
||||||
|
readonly,
|
||||||
|
computed,
|
||||||
|
getCurrentInstance,
|
||||||
|
watchEffect,
|
||||||
|
unref,
|
||||||
|
nextTick,
|
||||||
|
toRaw,
|
||||||
|
} from 'vue';
|
||||||
|
|
||||||
import { isEqual } from 'lodash-es';
|
import { isEqual } from 'lodash-es';
|
||||||
|
|
||||||
export function useRuleFormItem<T extends Recordable>(
|
export function useRuleFormItem<T extends Recordable>(
|
||||||
props: T,
|
props: T,
|
||||||
key: keyof T = 'value',
|
key: keyof T = 'value',
|
||||||
changeEvent = 'change'
|
changeEvent = 'change',
|
||||||
|
emitData?: Ref<any[]>
|
||||||
) {
|
) {
|
||||||
const instance = getCurrentInstance();
|
const instance = getCurrentInstance();
|
||||||
const emit = instance?.emit;
|
const emit = instance?.emit;
|
||||||
@ -33,7 +43,9 @@ export function useRuleFormItem<T extends Recordable>(
|
|||||||
if (isEqual(value, defaultState.value)) return;
|
if (isEqual(value, defaultState.value)) return;
|
||||||
|
|
||||||
innerState.value = value as T[keyof T];
|
innerState.value = value as T[keyof T];
|
||||||
emit?.(changeEvent, value);
|
nextTick(() => {
|
||||||
|
emit?.(changeEvent, value, ...(toRaw(unref(emitData)) || []));
|
||||||
|
});
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user