mt-ui-components-vue3/es/AutoComplete/autoComplete.js

玛果添实UI组件库(Vue3)

function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) {
    const op = ops[i];
    const fn = ops[i + 1];
    i += 2;
    if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) {
        return undefined;
    }
    if (op === 'access' || op === 'optionalAccess') {
        lastAccessLHS = value;
        value = fn(value);
    }
    else if (op === 'call' || op === 'optionalCall') {
        value = fn((...args) => value.call(lastAccessLHS, ...args));
        lastAccessLHS = undefined;
    }
} return value; }
/* Analyzed bindings: {
  "searchKey": "props",
  "AutoComplete": "setup-maybe-ref",
  "autoCompleteProps": "setup-maybe-ref",
  "ref": "setup-const",
  "props": "setup-reactive-const",
  "emit": "setup-const",
  "options": "setup-ref",
  "onSearch": "setup-const",
  "dropdownVisibleChange": "setup-const"
} */
import { defineComponent as _defineComponent } from 'vue';
import { renderSlot as _renderSlot, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, unref as _unref, mergeProps as _mergeProps, withCtx as _withCtx, openBlock as _openBlock, createBlock as _createBlock } from "vue";
import { AutoComplete } from 'ant-design-vue';
import { autoCompleteProps } from 'ant-design-vue/lib/auto-complete';
import { ref } from 'vue';
const __sfc_main__ = _defineComponent({
    props: {
        ...autoCompleteProps(),
        searchKey: {
            type: String,
            default: 'label',
        },
    },
    emits: ["select"],
    setup(__props, { emit }) {
        const props = __props;
        const options = ref(props.options);
        /**
         * 根据关键词提示
         * @param searchText 关键词
         */
        const onSearch = (searchText) => {
            options.value = props.options.filter((item) => !!_optionalChain([item, 'access', _2 => _2[props.searchKey], 'optionalAccess', _3 => _3.includes, 'call', _4 => _4(searchText)]));
            if (!options.value.length) {
                options.value.unshift({ label: searchText, value: searchText });
            }
        };
        const dropdownVisibleChange = (open) => {
            if (!open) {
                // 关闭还原下拉options
                setTimeout(() => {
                    options.value = props.options;
                });
            }
        };
        return (_ctx, _cache) => {
            return (_openBlock(), _createBlock(_unref(AutoComplete), _mergeProps(props, {
                options: options.value,
                onSearch: onSearch,
                onDropdownVisibleChange: dropdownVisibleChange
            }), {
                option: _withCtx(({ value, label }) => [
                    _renderSlot(_ctx.$slots, "option", { value: value }, () => [
                        _createTextVNode(_toDisplayString(label || value), 1 /* TEXT */)
                    ])
                ]),
                default: _withCtx(() => [
                    _renderSlot(_ctx.$slots, "default")
                ]),
                _: 3 /* FORWARDED */
            }, 16 /* FULL_PROPS */, ["options"]));
        };
    }
});
export default __sfc_main__;