<el-image
style="width: 70px; height: 80px"
:src="imageUrl"
></el-image>
<div>
<img alt="" ref="img" />
<input type="file" ref="file" @change="showimg">
</div>
<el-button type="primary"
@click="submit">确定</el-button>
data () {
return {
imageUrl: "",
}
},
methods: {
showimg () {
const that = this;
var fr = new FileReader()
fr.readAsDataURL(that.$refs.file.files[0])
fr.onload = function () {
that.imageUrl = fr.result;
}
},
submit(){
const file = this.$refs.file.files[0];
let formData = new FormData()
// formData.append(name,value)
formData.append('file', file)
formData.append('name', this.dataForm.name)
formData.append('gender', this.dataForm.gender)
formData.append('kind', this.dataForm.kind)
formData.append('age', this.dataForm.age)
// this.$http可以改为axios({}) 看个人用法
this.$http({
url: this.$http.adornUrl('/device/saveUser'),
method: 'post',
data: formData,
headers: {
'Content-Type': 'multipart/form-data',
}
}).then(({data}) => {
if (data.code == 0) {
Message({
message: '新增成功',
type: 'success'
});
} else {
Message({
message: data.msg,
type: 'error'
})
}
}).catch(err => {
})
}
}