el-upload手动上传图片

el-upload 是一个 Element UI 提供的组件，可以用来上传文件，其中也包括图片。在手动上传图片时，可以使用以下步骤：

1. 在模板中使用 el-upload 组件，并设置相应的属性：

<el-upload
  class="upload-demo"
  action="/upload"
  :on-success="handleSuccess"
  :before-upload="beforeUpload"
  :show-file-list="false">
  <el-button size="small" type="primary">点击上传</el-button>
  <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
</el-upload>

其中，`action` 属性指定了上传文件的 URL，`on-success` 属性指定了上传成功后的回调函数，`before-upload` 属性指定了上传前的处理函数，`show-file-list` 属性设置为 `false`，表示不展示已上传的文件列表。

2. 在 Vue 实例中定义相应的方法：

export default {
  methods: {
    handleSuccess(response, file, fileList) {
      console.log(response, file, fileList);
    },
    beforeUpload(file) {
      const isJPG = file.type === 'image/jpeg' || file.type === 'image/png';
      const isLt2M = file.size / 1024 / 1024 < 2;

      if (!isJPG) {
        this.$message.error('上传头像图片只能是 JPG 格式!');
      }
      if (!isLt2M) {
        this.$message.error('上传头像图片大小不能超过 2MB!');
      }
      return isJPG && isLt2M;
    },
  },
};

`handleSuccess` 方法会在上传成功后被调用，参数 `response` 表示服务端返回的数据，`file` 表示当前上传的文件，`fileList` 表示已上传的文件列表。

`beforeUpload` 方法会在上传前被调用，参数 `file` 表示当前要上传的文件。在该方法中，可以进行文件类型、大小等的校验。如果校验不通过，可以通过 `this.$message.error` 方法弹出错误提示。

注意：以上代码中的 `this.$message` 是 Element UI 提供的消息提示组件，需要在 Vue 实例中进行注册。