code: remove v-lazy-image

This commit is contained in:
ShawnPhang 2023-10-03 23:25:01 +08:00
parent 4467227b47
commit 3c3e0ce0ae
2 changed files with 2 additions and 5 deletions

View File

@ -30,7 +30,6 @@
"qr-code-styling": "^1.6.0-rc.1", "qr-code-styling": "^1.6.0-rc.1",
"selecto": "^1.13.0", "selecto": "^1.13.0",
"throttle-debounce": "^3.0.1", "throttle-debounce": "^3.0.1",
"v-lazy-image": "^2.1.1",
"vue": "^3.0.0", "vue": "^3.0.0",
"vue-router": "^4.0.0-0", "vue-router": "^4.0.0-0",
"vuedraggable": "^4.1.0", "vuedraggable": "^4.1.0",

View File

@ -3,26 +3,24 @@
* @Date: 2021-12-16 16:20:16 * @Date: 2021-12-16 16:20:16
* @Description: 瀑布流组件 * @Description: 瀑布流组件
* @LastEditors: ShawnPhang <https://m.palxp.cn> * @LastEditors: ShawnPhang <https://m.palxp.cn>
* @LastEditTime: 2023-10-03 22:58:32 * @LastEditTime: 2023-10-03 23:22:46
--> -->
<template> <template>
<div ref="imgWaterFall" :style="{ height: countHeight + 'px' }" class="img-water-fall"> <div ref="imgWaterFall" :style="{ height: countHeight + 'px' }" class="img-water-fall">
<!-- backgroundImage: `url(${item.cover})` --> <!-- backgroundImage: `url(${item.cover})` -->
<div v-for="(item, index) in list" :key="index + 'iwf'" :style="{ top: item.top + 'px', left: item.left + 'px', width: width + 'px', height: item.height + 'px' }" class="img-box" @click.stop="selectItem(item, index)"> <div v-for="(item, index) in list" :key="index + 'iwf'" :style="{ top: item.top + 'px', left: item.left + 'px', width: width + 'px', height: item.height + 'px' }" class="img-box" @click.stop="selectItem(item, index)">
<v-lazy-image v-if="!item.fail" class="img" :src="item.cover" @error="loadError(item)" /> <el-image v-if="!item.fail" class="img" :src="item.cover" lazy loading="lazy" @error="loadError(item)" />
<div v-else class="fail_img">{{ item.title }}</div> <div v-else class="fail_img">{{ item.title }}</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import vLazyImage from 'v-lazy-image'
const NAME = 'img-water-fall' const NAME = 'img-water-fall'
import { defineComponent, toRefs, reactive, watch } from 'vue' import { defineComponent, toRefs, reactive, watch } from 'vue'
export default defineComponent({ export default defineComponent({
name: NAME, name: NAME,
components: { vLazyImage },
props: { props: {
listData: { listData: {
type: Array, type: Array,