diff --git a/src/runtime/components/InputMenu.vue b/src/runtime/components/InputMenu.vue index ff9b9735..e6c87e8c 100644 --- a/src/runtime/components/InputMenu.vue +++ b/src/runtime/components/InputMenu.vue @@ -179,13 +179,17 @@ const ui = computed(() => inputMenu({ buttonGroup: orientation.value })) -function displayValue(value: AcceptableValue): string { - const item = items.value.find(item => props.valueKey ? isEqual(get(item as Record, props.valueKey as string), value) : isEqual(item, value)) +function displayValue(value: T): string { + if (!props.valueKey) { + return value && (typeof value === 'object' ? get(value, props.labelKey as string) : value) + } + + const item = items.value.find(item => isEqual(get(item as Record, props.valueKey as string), value)) return item && (typeof item === 'object' ? get(item, props.labelKey as string) : item) } -function filterFunction(items: ArrayOrWrapped, searchTerm: string): ArrayOrWrapped { +function filterFunction(items: ArrayOrWrapped, searchTerm: string): ArrayOrWrapped { if (props.filter === false) { return items } diff --git a/src/runtime/components/SelectMenu.vue b/src/runtime/components/SelectMenu.vue index beb6b8e1..44cd00c1 100644 --- a/src/runtime/components/SelectMenu.vue +++ b/src/runtime/components/SelectMenu.vue @@ -170,10 +170,14 @@ const ui = computed(() => selectMenu({ function displayValue(value: T | T[]): string { if (props.multiple && Array.isArray(value)) { - return value.map(v => displayValue(v)).join(', ') + return value.map(v => displayValue(v)).filter(Boolean).join(', ') } - const item = items.value.find(item => props.valueKey ? isEqual(get(item as Record, props.valueKey as string), value) : isEqual(item, value)) + if (!props.valueKey) { + return value && (typeof value === 'object' ? get(value, props.labelKey as string) : value) + } + + const item = items.value.find(item => isEqual(get(item as Record, props.valueKey as string), value)) return item && (typeof item === 'object' ? get(item, props.labelKey as string) : item) }