uni-app - 图像加载时渐隐淡入效果（image）

前言

由于 uni-app 图片组件加载成功后，会突然显示出来比较生硬，所以需要对其进行动画修饰。

我们可以利用简单的动画对其进行修饰，当图片加载完毕后应用

自己设置一个渐隐的过渡效果时间，如下图所示：

解决方案

有两种方案，第一种即利用纯 CSS 动画进行，第二种则利用图片组件 load 事件进行监听加载，随即调用函数绑定动画，两种方式均有利弊。

本文采用最简洁且易维护的第一种方案，

请看如下示例代码，随便找个页面直接复制就能用。

<image
src="https://img.yzcdn.cn/vant/cat.jpeg"