vue3 element-plus图片预览

在Vue 3中使用Element Plus进行图片预览，你可以按照以下步骤进行操作：

1. 首先，确保已经安装好Vue 3和Element Plus，并将它们引入到你的项目中。

2. 在需要使用图片预览的组件中，首先导入`ElImage`组件：

import { ElImage } from 'element-plus';

3. 在组件的`template`部分，使用`ElImage`组件来展示图片，设置`src`属性为图片的URL，设置其他可选属性如`fit`来控制图片的显示方式：

<template>
  <ElImage src="图片URL" fit="contain"></ElImage>
</template>

其中，`fit`属性可以设置为以下值：
- `fill`：图片将被强制拉伸或压缩以适应容器。
- `contain`：图片按比例缩放以适应容器，可能会有留白。
- `cover`：图片按比例缩放以填满容器，可能会有裁剪。
- `none`：图片按原始大小显示。

4. 通过`npm run serve`启动项目，即可看到图片预览效果。