uniapp实现GIF图默认不播放，当鼠标移入时再播放

在uni-app开发中，如果你想实现GIF图片默认不显示动画效果，只有当鼠标悬停时才开始播放，可以按照以下步骤操作：

1. 首先，在HTML模板中，将GIF图片设置为初始时CSS的`display`属性为`none`或`hidden`，例如：

<image src="your_gif.gif" :class="{ animated: isHovered }"></image>

这里假设有一个名为`isHovered`的Vue数据绑定变量。

2. 定义`isHovered`的数据：

data() {
  return {
    isHovered: false,
  };
},

3. 添加鼠标进入和离开事件监听器，切换`isHovered`的状态：

methods: {
  handleMouseEnter() {
    this.isHovered = true;
  },
  handleMouseLeave() {
    this.isHovered = false;
  },
},

4. 给图片添加样式，利用`:class`动态改变CSS：

.animated {
  display: block; /* 或者 inline-block 如果需要保持原有布局 */
  animation-play-state: paused; /* 禁止默认播放 */
}
.animated:hover {
  animation-play-state: running; /* 当鼠标悬停时，恢复动画播放 */
}

通过这种方式，GIF图片将在鼠标移动到其上时开始播放，离开时暂停。