微信小程序中显示图片

在微信小程序中显示图片通常使用`<image>`组件。以下是一些基本步骤和示例代码，帮助你在小程序中显示图片：

1. **在WXML文件中使用`<image>`组件**：

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

2. **在JS文件中定义图片的URL**：

Page({
  data: {
    imageUrl: 'https://example.com/path/to/your/image.jpg'
  }
})

3. **常用属性**：
- `src`：图片的资源地址，可以是本地路径或网络地址。
- `mode`：图片的裁剪、缩放模式，例如`widthFix`、`aspectFit`、`aspectFill`等。
- `lazy-load`：图片懒加载，在即将进入一定范围时才加载图片。

4. **示例**：

<view class="container">
  <image src="{{imageUrl}}" mode="aspectFit" lazy-load></image>
</view>

Page({
  data: {
    imageUrl: 'https://example.com/path/to/your/image.jpg'
  }
})

5. **样式**：
你可以在WXSS文件中添加样式来控制图片的大小和位置。

.container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}

image {
  width: 100%;
  height: auto;
}

通过以上步骤，你可以在微信小程序中显示图片，并进行基本的样式和属性设置。