flamingo-ui/es/pre-image/PreImage.js

火烈鸟UI组件库

import "./PreImage-sfc.css";
import { ref } from "vue";
const __default__ = {
  directives: {
    lazy: {
      mounted(el, bindings) {
        el.setAttribute("data-lazy", "loading");
        if (window && window.IntersectionObserver) {
          const observer = new IntersectionObserver(
            ([{ isIntersecting }]) => {
              if (isIntersecting) {
                observer.unobserve(el);
                el.src = bindings.value;
                el.onload = el.setAttribute("data-lazy", "loaded");
                el.onerror = () => {
                  props.errorImg ? el.src = props.errorImg : "";
                };
              }
            },
            {
              threshold: 0
            }
          );
          observer.observe(el);
        }
      }
    }
  }
};
const __vue_sfc__ = /* @__PURE__ */ Object.assign(__default__, {
  __name: "PreImage",
  props: {
    src: {
      type: String,
      default: ""
    },
    alt: {
      type: String,
      default: ""
    },
    fit: {
      type: String,
      default: "cover"
    },
    errorImg: {
      type: String,
      default: ""
    }
  },
  setup(__props, { expose }) {
    expose();
    const props2 = __props;
    const loaded = ref(false);
    const onload = () => {
      loaded.value = true;
    };
    const __returned__ = { props: props2, loaded, onload, ref };
    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
    return __returned__;
  }
});
import { normalizeStyle as _normalizeStyle, resolveDirective as _resolveDirective, createElementVNode as _createElementVNode, withDirectives as _withDirectives, openBlock as _openBlock, createElementBlock as _createElementBlock } from "vue";
const _hoisted_1 = { class: "fmg-pre-image" };
const _hoisted_2 = ["alt"];
function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
  const _directive_lazy = _resolveDirective("lazy");
  return _openBlock(), _createElementBlock("div", _hoisted_1, [
    _withDirectives(_createElementVNode("img", {
      alt: $props.alt,
      style: _normalizeStyle($setup.loaded ? `opacity: 1;` : `object-fit: ${$props.fit};`)
    }, null, 12, _hoisted_2), [
      [_directive_lazy, $props.src.replace("http:", "https:")]
    ])
  ]);
}
__vue_sfc__.render = __vue_render__;
var stdin_default = __vue_sfc__;
export {
  stdin_default as default
};