When using search, multiselect emit an array of undefined. about multiselect HOT 3 CLOSED

// BaseSearch.vue

<template>
	<Multiselect
		v-model="model"
		v-bind="$attrs"
		:object="true"
		:searchable="true"
		:loading="loading"
		:options="selectOptions"
		value-prop="id"
		track-by="name"
		label="name"
		@search-change="search"
	/>
</template>

<script lang="ts">
import {
	PropType,

	defineComponent,
	computed,
	ref
} from '@vue/composition-api';

import Multiselect from '@vueform/multiselect/dist/multiselect.vue2';

import { useSearchQuery } from '@/graphql';

export default defineComponent({
	components: {
		Multiselect
	},
	props: {
		value: {
			type: [Array, Object, String, Boolean, Number] as PropType<any>
		},
		type: {
			type: String as PropType<'USER' | 'TAG'>,
			required: true
		}
	} as const,
	setup(props, { emit }) {
		const model = computed({
			get: () => props.value,
			set: (value: any) => {
				emit('input', value);
			}
		});

		const variables = ref({});

		const { loading, result } = useSearchQuery(variables);

		const relayConnection = computed(() => (
			result.value?.search || {
				edges: []
			}
		));

		const selectOptions = computed(() => (
			relayConnection.value.edges.map(edge => edge.node)
		));

		const search = (query: string) => {
			if (!query) {
				return;
			}

			variables.value = {
				query,

				type: props.type
			};
		};

		return {
			model,

			loading,
			selectOptions,

			search
		};
	}
});
</script>

<BaseSearch
	v-model="mainteners"
	mode="tags"
	type="USER"
/>