select.vue

<template>
    <a-tree-select
        show-search
        style="width: 100%"
        :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
        placeholder="请选择"
        allow-clear
        tree-default-expand-all
        :treeData="treeData"
        :replaceFields="replaceFields"
        v-bind="$attrs"
        v-on="$listeners"
    />
</template>

<script>
import { getMenuDataApi } from '@/api';
import { convertListToTree } from '@/utils';

export default {
    model: {
        prop: 'value',
        event: 'change',
    },
    data() {
        return {
            treeData: [],
            replaceFields: {
                title: 'menuName',
                key: 'menuId',
                value: 'menuId',
            },
        };
    },
    async mounted() {
        this.treeData = convertListToTree(await getMenuDataApi(), true);
    },
};
</script>