element vue2 文件上传及回显

在 Vue 2 中实现文件上传及回显的步骤如下：

1. 首先，在你的组件中引入 Element UI 的上传组件：

<el-upload
  class="avatar-uploader"
  action="your_upload_url"
  :show-file-list="false"
  :on-success="handleUploadSuccess"
>
  <img v-if="imageUrl" :src="imageUrl" class="avatar">
  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>

这里的 `action` 是上传文件的 URL，你需要将其替换为你自己的后端接口地址。`handleUploadSuccess` 是一个方法，用于处理上传成功后的回调。

2. 在你的 Vue 组件中，定义相关的数据和方法：

data() {
  return {
    imageUrl: ''  // 用于存储上传成功后的图片地址
  };
},
methods: {
  handleUploadSuccess(response, file) {
    // 上传成功后，将返回的图片地址赋值给 imageUrl
    this.imageUrl = response.url;
  }
}

这样就完成了文件上传及回显功能的实现。你可以根据需要修改样式和其他相关配置。注意，这里的示例使用了 Element UI 的上传组件，如果你使用其他的 UI 库或自己实现上传组件，代码会有所不同，但整体思路是一样的。