一.处理base64格式
这个是截取的做项目的代码片段
这个是使用new FileReader()
onFileChange (e) {
// 然后我们要获取里面的图片的路径值
const files = e.target.files[0]
console.log(e, 111)
// 这个时候要给判断，如果没有选择的话将图片默认显示和将图片禁用
// 下面是文件大小的限制，还有选择图片后头像上传打开，最后把选择的图片赋值给图片
if (files.size / 1024 / 1024 > 1.5) return this.$message.warning('图像大小不能超过1.5M')
// 3. 处理base64格式图片 回显
// 3.1 使用fileReader文件读取对象 处理base64格式
if (files) {
var fr = new FileReader() // 研究对象就是研究三要素：属性+方法+回调函数
// 使用readAsDataURL方法读取文件 读取file文件
fr.readAsDataURL(files)
// 监听什么时候读取完毕
// fr.addEventListener('load')
fr.onload = () => {
// 读取完毕后获取读取的结果
console.log(1111222, this)
this.userImg = fr.result // 将图片上展示出来
this.isDisabled = false
}
}
console.log(files, '图片')
},
二. FormData格式的图片
这个是截取的做项目的代码片段
使用 new FormData()
const fm = new FormData()
fm.append('title', this.pubForm.title)
fm.append('cate_id', this.pubForm.cate_id)
fm.append('content', this.pubForm.content)
fm.append('state', this.pubForm.state)
// cover_img要的是一个文件对象
fm.append('cover_img', this.file)
const { data } = await reqPublishArticle(fm)
