@fesjs/fes-design/es/upload/trigger.js

fes-design for PC

import { defineComponent, inject, computed, openBlock, createElementBlock, normalizeClass, unref, renderSlot, createVNode, withCtx, createTextVNode, toDisplayString, createElementVNode, withModifiers } from 'vue';
import Button from '../button/button';
import UploadOutlined from '../icon/UploadOutlined';
import { useLocale } from '../config-provider/useLocale';
import { key } from './const';

const _hoisted_1 = ["name", "multiple", "accept"];
var script = /*@__PURE__*/defineComponent({
  __name: 'trigger',
  setup(__props) {
    const {
      name,
      multiple,
      accept,
      disabled,
      prefixCls,
      onUploadFiles,
      inputRef
    } = inject(key);
    const acceptStr = computed(() => accept.value.join(','));
    const handleClick = () => {
      if (disabled.value) {
        return;
      }
      inputRef.value.click();
    };
    const handleChange = e => {
      const target = e.target;
      const files = target.files;
      if (!files) {
        return;
      }
      onUploadFiles(files);

      // 若不重置，重复选择相同文件，change 事件可能不触发
      target.value = null;
    };
    const {
      t
    } = useLocale();
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", {
        class: normalizeClass(unref(prefixCls)),
        onClick: handleClick
      }, [renderSlot(_ctx.$slots, "default", {}, () => [createVNode(unref(Button), {
        class: normalizeClass(`${unref(prefixCls)}-trigger-default`),
        disabled: unref(disabled)
      }, {
        icon: withCtx(() => [createVNode(unref(UploadOutlined))]),
        default: withCtx(() => [createTextVNode(" " + toDisplayString(unref(t)('upload.btnText')), 1 /* TEXT */)]),
        _: 1 /* STABLE */
      }, 8 /* PROPS */, ["class", "disabled"])]), createElementVNode("input", {
        ref_key: "inputRef",
        ref: inputRef,
        class: normalizeClass(`${unref(prefixCls)}-input`),
        type: "file",
        name: unref(name),
        multiple: unref(multiple),
        accept: acceptStr.value,
        onChange: handleChange,
        onClick: _cache[0] || (_cache[0] = withModifiers(() => {}, ["stop"]))
      }, null, 42 /* CLASS, PROPS, NEED_HYDRATION */, _hoisted_1)], 2 /* CLASS */);
    };
  }
});

script.__file = "components/upload/trigger.vue";

export { script as default };