uniapp中的image标签使用

在uniApp框架中，`<image>` 标签用于显示图片资源，它是小程序和H5页面都支持的基本元素。以下是使用 `<image>` 标签的一些基本步骤：

1. **基本语法**：

   <image src="{{imageUrl}}" mode="cover" />

`src` 属性引用你要展示的图片URL，`mode` 可选属性设置图片的填充模式，默认值为 "contain"，表示保持原始比例缩放填充容器。

2. **加载状态**：
如果需要在图片加载时显示占位符或等待加载完成后的效果，可以添加 `loading` 和 `error` 属性：

   <image src="{{imageUrl}}" loading="lazy" error="default">
     <image src="/placeholder.png" placeholder="true" /> <!-- 占位图 -->
   </image>

3. **大小和宽高比**：
可以设置宽度和高度，或者使用 `width` 和 `height` 属性来指定尺寸，例如：

   <image :src="imageUrl" width="200" height="300" />

4. **样式控制**：
使用 CSS 类名或内联样式来自定义图片的样式，如边框、圆角等。