发表于： 2020-08-04 21:44:52
1 2158
今日完成
前端图片上传
运用input type=“file”的标签获取图片，再使用FileReader这个对象 new 一个实例，通过这个对象的readAsDataURL()方法读取file标签获取的图片并转换为base64格式，完成之后通过ajax之类的方式传到后台
注意:不能通过双向绑定的方式获取input上传图片的值
需要用
@change="inputImg($event)"
注意:vue中直接this指向是无效的
html:$event(实参)
vue(js):函数体(形参),这里$event起到类似this的作用
let aa = 形参.target.files[0]
or
在目标dom元素中,添加ref="xx",相当于设置锚点
然后
vue:
xx = this.$refs.xx.files[0]
获取图片名称
this.name = file.name
获取图片大小
this.size = ((file.size) / 1024 / 1024).toFixed(2) + 'MB'
从定样式
1.可以设置input透明属性和绝对定位,设置样式然后input完全覆盖
2.设置;样式完全覆盖input,可以设置透过属性or点击触发input的点击
进度条
progress
返回列表
评论