Test.vue 1.4 KB
<template>
    <a-select
        v-model:value="value"
        show-search
        mode="multiple"
        :maxTagCount="1"
        style="width: 280px"
        :options="options"
        optionFilterProp="label"
    >
        <a-select-option
            v-for="item in options"
            :value="item.value"
        >
            {{ item.label }}
        </a-select-option>
    </a-select>
</template>
<script>
import {defineComponent, ref} from 'vue'

export default defineComponent({
    setup() {
        const options = ref([
            {
                value: 'jack',
                label: '飞飞飞飞飞飞飞',
            },
            {
                value: 'lucy',
                label: 'lllll',
            },
            {
                value: 'tom',
                label: 'tttttt',
            },
        ])

        const handleChange = value => {
            console.log(`selected ${value}`)
        }

        const handleBlur = () => {
            console.log('blur')
        }

        const handleFocus = () => {
            console.log('focus')
        }

        const filterOption = (input, option) => {
            return option.value.toLowerCase().indexOf(input.toLowerCase()) >= 0
        }

        return {
            value: ref(undefined),
            filterOption,
            handleBlur,
            handleFocus,
            handleChange,
            options,
        }
    },
})
</script>