el-form实现表单和图片手动上传和校验(1)

在el-upload中定义属性:auto-upload=“false” 可以禁止文件自动上传，既然禁止了自动上传那么我们就需要拿到文件对象。通过upload组件的on-change属性我们可以监听文件添加、上传时的状态改变，利用该属性触发自定义事件可以获取到需要的文件属性。利用window.createObjectURL(e.raw)创建图片地址实现本地预览，如果fileList长度大于0说明已经上传了图片这时我们就通过clearValidate去掉校验提示。

表单和图片上传

有文件的form表单上传数据要用formData类型，我们需要创建一个 FormData 对象来接收文件数据。选择了图片并填写必填信息之后点击【注册】按钮发起注册请求，在register 方法里把表单信息通过append将数据添加到formData中。然后利用axios向后台发起注册请求并发送注册信息，res为返回的请求结果。