refactor(upload): 优化图片查看组件的渲染逻辑
将 `onWheel` 事件处理移到父元素,简化 `img` 元素的属性定义,提升代码可读性和维护性
This commit is contained in:
parent
5e00eccb29
commit
8fd2f9da68
@ -1,5 +1,5 @@
|
||||
import { w as withInstall } from "../badge/index2.js";
|
||||
import { defineComponent, computed, openBlock, createElementBlock, normalizeStyle, unref, createCommentVNode, toDisplayString, normalizeClass, ref, watch, onMounted, nextTick, createElementVNode, withModifiers, Fragment, renderList, shallowRef, createTextVNode, createVNode, useSlots, inject, Transition, withCtx, createBlock, renderSlot, h, render, isVNode, getCurrentInstance, onUnmounted } from "vue";
|
||||
import { defineComponent, computed, openBlock, createElementBlock, normalizeStyle, unref, createCommentVNode, toDisplayString, normalizeClass, ref, watch, onMounted, nextTick, withModifiers, createElementVNode, Fragment, renderList, shallowRef, createTextVNode, createVNode, useSlots, inject, Transition, withCtx, createBlock, renderSlot, h, render, isVNode, getCurrentInstance, onUnmounted } from "vue";
|
||||
import { I as ImageCompressor } from "../_chunks/js-image-compressor/index.js";
|
||||
import { t as templateRef } from "../_chunks/@vueuse/index.js";
|
||||
import { _ as _sfc_main$9 } from "../button/index2.js";
|
||||
@ -632,10 +632,8 @@ function _objectSpread$3(e) {
|
||||
}
|
||||
return e;
|
||||
}
|
||||
var _hoisted_1$2 = {
|
||||
class: "layui-layer-phimg"
|
||||
};
|
||||
var _hoisted_2$2 = ["src", "onWheel"];
|
||||
var _hoisted_1$2 = ["onWheel"];
|
||||
var _hoisted_2$2 = ["src"];
|
||||
var _hoisted_3$2 = {
|
||||
key: 0,
|
||||
class: "layui-layer-imgsee"
|
||||
@ -711,13 +709,15 @@ var _sfc_main$2 = defineComponent(_objectSpread$3(_objectSpread$3({}, __default_
|
||||
scale.value = Math.min(Math.max(newScale, 0.5), 3);
|
||||
};
|
||||
return function(_ctx, _cache) {
|
||||
return openBlock(), createElementBlock("div", _hoisted_1$2, [createElementVNode("img", {
|
||||
src: __props.imgList[index2.value].src,
|
||||
return openBlock(), createElementBlock("div", {
|
||||
class: "layui-layer-phimg",
|
||||
onWheel: withModifiers(handleWheel, ["prevent"]),
|
||||
style: normalizeStyle({
|
||||
transform: "scale(".concat(scale.value, ")")
|
||||
})
|
||||
}, null, 44, _hoisted_2$2), __props.imgList.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_3$2, [__props.imgList.length > 1 ? (openBlock(), createElementBlock("span", _hoisted_4$1, [createElementVNode("a", {
|
||||
}, [createElementVNode("img", {
|
||||
src: __props.imgList[index2.value].src
|
||||
}, null, 8, _hoisted_2$2), __props.imgList.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_3$2, [__props.imgList.length > 1 ? (openBlock(), createElementBlock("span", _hoisted_4$1, [createElementVNode("a", {
|
||||
href: "javascript:;",
|
||||
class: "layui-layer-iconext layui-layer-imgprev",
|
||||
onClick: _cache[0] || (_cache[0] = function($event) {
|
||||
@ -750,7 +750,7 @@ var _sfc_main$2 = defineComponent(_objectSpread$3(_objectSpread$3({}, __default_
|
||||
style: normalizeStyle({
|
||||
left: "calc(calc( calc(100% - ".concat(100 * __props.imgList.length, "px) / 2) + ").concat(index2.value * 100, "px)")
|
||||
})
|
||||
}, null, 4)])) : (openBlock(), createElementBlock("span", _hoisted_8$1, [__props.imgList[index2.value].alt ? (openBlock(), createElementBlock("span", _hoisted_9, toDisplayString(__props.imgList[index2.value].alt), 1)) : createCommentVNode("", true), __props.imgList.length > 1 ? (openBlock(), createElementBlock("em", _hoisted_10, toDisplayString(index2.value + 1) + " / " + toDisplayString(__props.imgList.length), 1)) : createCommentVNode("", true)]))], 4)) : createCommentVNode("", true)])) : createCommentVNode("", true)]);
|
||||
}, null, 4)])) : (openBlock(), createElementBlock("span", _hoisted_8$1, [__props.imgList[index2.value].alt ? (openBlock(), createElementBlock("span", _hoisted_9, toDisplayString(__props.imgList[index2.value].alt), 1)) : createCommentVNode("", true), __props.imgList.length > 1 ? (openBlock(), createElementBlock("em", _hoisted_10, toDisplayString(index2.value + 1) + " / " + toDisplayString(__props.imgList.length), 1)) : createCommentVNode("", true)]))], 4)) : createCommentVNode("", true)])) : createCommentVNode("", true)], 44, _hoisted_1$2);
|
||||
};
|
||||
}
|
||||
}));
|
||||
|
18
lib/index.js
18
lib/index.js
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Loading…
x
Reference in New Issue
Block a user