js怎么利用FileReader实现图片转base64格式并上传预览头像(base64,JS,开发技术)

时间:2024-05-09 10:58:45 作者 : 石家庄SEO 分类 : 开发技术
  • TAG :

    js%E6%80%8E%E4%B9%88%E5%88%A9%E7%94%A8FileReader%E5%AE%9E%E7%8E%B0%E5%9B%BE%E7%89%87%E8%BD%ACbase64%E6%A0%BC%E5%BC%8F%E5%B9%B6%E4%B8%8A%E4%BC%A0%E9%A2%84%E8%A7%88%E5%A4%B4%E5%83%8F

修改用户头像,一般都会需要把图片转成base64格式,所以我们需要学会怎么利用FileReader转换

1.点击button按钮触发input的点击事件,所以需要给input设置ref拿到Dom

2.给input设置change改变事件

2.1设置一个变量接收转换的数据

2.2拿到事件目标,里面有个方法e.target.files是个伪数组.通过e.target.files.length判断用户是否选择了图片

2.3通过new FileReader拿到一个实例

2.4通过 实例名.readAsDataURL 将图片转成base64格式

2.5onload可以监听转换完成后/给声明变量赋值

3.点击上传按钮发送axios/上传成功重新请求用户信息实现信息刷新

本文:js怎么利用FileReader实现图片转base64格式并上传预览头像的详细内容,希望对您有所帮助,信息来源于网络。
上一篇:小程序如何实现简单吸顶效果下一篇:

13 人围观 / 0 条评论 ↓快速评论↓

(必须)

(必须,保密)

阿狸1 阿狸2 阿狸3 阿狸4 阿狸5 阿狸6 阿狸7 阿狸8 阿狸9 阿狸10 阿狸11 阿狸12 阿狸13 阿狸14 阿狸15 阿狸16 阿狸17 阿狸18