✨(select): 新增 search-method 属性
This commit is contained in:
@@ -31,6 +31,7 @@ export interface SelectProps {
|
||||
disabled?: boolean;
|
||||
placeholder?: string;
|
||||
searchPlaceholder?: string;
|
||||
searchMethod?: Function;
|
||||
modelValue?: any;
|
||||
multiple?: boolean;
|
||||
items?: SelectOptionProps[];
|
||||
@@ -81,7 +82,6 @@ const getOption = (nodes: VNode[], newOptions: any[]) => {
|
||||
if (item.children) {
|
||||
// @ts-ignore
|
||||
const label = item.children.default()[0].children;
|
||||
|
||||
if (typeof label == "string") {
|
||||
// @ts-ignore
|
||||
item.props.label = label;
|
||||
@@ -122,7 +122,6 @@ const onCompositionend = (event: Event) => {
|
||||
onMounted(() => {
|
||||
intOption();
|
||||
timer = setInterval(intOption, 500);
|
||||
|
||||
watch(
|
||||
[selectedValue, options],
|
||||
() => {
|
||||
@@ -188,6 +187,7 @@ provide("openState", openState);
|
||||
provide("selectedValue", selectedValue);
|
||||
provide("searchValue", searchValue);
|
||||
provide("multiple", multiple);
|
||||
provide("searchMethod", props.searchMethod);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
||||
@@ -30,6 +30,7 @@ const props = withDefaults(defineProps<SelectOptionProps>(), {
|
||||
|
||||
const searchValue: Ref<string> = inject("searchValue") as Ref<string>;
|
||||
const selectRef: Ref<HTMLElement> = inject("selectRef") as Ref<HTMLElement>;
|
||||
const searchMethod: Function = inject("searchMethod") as Function;
|
||||
const selectedValue: WritableComputedRef<any> = inject(
|
||||
"selectedValue"
|
||||
) as WritableComputedRef<any>;
|
||||
@@ -59,10 +60,16 @@ const selected = computed(() => {
|
||||
}
|
||||
});
|
||||
|
||||
// 首次加载, 不启用 search-method 方法。
|
||||
const isFirst = ref(true);
|
||||
|
||||
const display = computed(() => {
|
||||
return (
|
||||
props.keyword?.toString().indexOf(searchValue.value) > -1 ||
|
||||
props.label?.toString().indexOf(searchValue.value) > -1
|
||||
if(searchMethod && !isFirst.value) {
|
||||
isFirst.value = false;
|
||||
return searchMethod(searchValue.value, props);
|
||||
}
|
||||
return (
|
||||
props.keyword?.toString().indexOf(searchValue.value) > -1 || props.label?.toString().indexOf(searchValue.value) > -1
|
||||
);
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user