建设部网站取消园林资质,如何破解wordpress数据库,wordpress 发通知,wordpress域名地址设置方法背景
在写项目时#xff0c;加载图片未成功前#xff0c;会出现空白页面#xff0c;太影响美观和体验感
解决方案
1. element ui通过slot占位符解决 2. 自定义指令
原生img标签可以通过自定义指令解决#xff0c;img标签有onload和onerror事件#xff0c;都是在渲染成…背景
在写项目时加载图片未成功前会出现空白页面太影响美观和体验感
解决方案
1. element ui通过slot占位符解决 2. 自定义指令
原生img标签可以通过自定义指令解决img标签有onload和onerror事件都是在渲染成功后才出发想占位要在渲染前触发
templateimgclassimage_item-imgv-preloadloading srchttps://xxalt加载失败/
/template
script setup
import { reactive } from vue// 自定义图片占位
const vPreload {//未渲染img标签前beforeMount(el, binding) {el.style.backgroundColor #ecececel.classList.add(binding.value) //binding.value是上面传过来loading我自定义的类名可自己定义loading样式},mounted(el, binding) {el.addEventListener(error, () {el.classList.remove(binding.value)})},
}
/script3.用图片代替 imgclassimage_item-imgv-for(item, index) in imageList:keyitem.id:srcitem.url ? require(/src/assets/logo.png) : item.urlalt加载失败clickhandlePreview(index)/
