提交 fa64fc8a 作者: Vben

fix(api-select): ensure that the onchange function parameters are correct

上级 a2a75a09
...@@ -2,6 +2,7 @@ ...@@ -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 @@ ...@@ -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 @@ ...@@ -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>
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>( ...@@ -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)) || []));
});
}, },
}); });
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论