达夕博客
  • 首页
  • 软件工具
    • 提高生产力
    • 数字化办公
    • 智能手机
    • 开发工具
  • 技术编程
  • 互联网
  • 关于
  1. 首页
  2. 技术编程
  3. 正文

Vue中图片文件转换为Base64格式的方法

2019年07月16日 21099点热度 5人点赞 0条评论

Vue中图片文件转换为Base64格式的方法

工具方法:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function convertImgToBase64(imageFile, callback, errorCallback) {
  try {
    let reader = new FileReader()
    reader.readAsDataURL(imageFile)
    reader.onload = function(e) {
      if (callback) {
        let base64Str = e.target.result
        callback(base64Str)
      }
    }
  } catch (error) {
    console.error(error)
    if (errorCallback) {
      errorCallback(error)
    }
  }
}

说明:

  • imageFile参数对应file文件的raw属性
  • callback参数,转换成功的回调函数
  • errorCallback参数,转换失败的回调函数

使用样例:

1
convertImgToBase64(this.file.raw, base64Str => console.log(base64Str), error => console.log(error));

 

标签: Base64 Vue 图片转换
最后更新:2019年07月17日

达夕

保持饥渴的专注,追求最佳的品质

点赞
< 上一篇
下一篇 >

文章评论

取消回复

最新 热点 随机
最新 热点 随机
通过.git文件夹恢复代码仓库 Nginx 如何限流和访问控制(详解) Docker在宿主机上根据进程PID查找归属容器ID 云原生环境是使用Nocalhost开发调试Spring boot应用 全能数据库管理工具DataGrip推荐使用2019.3.5版本 安卓优秀播放器KMPlayer Plus (Divx)_v30.12.251下载 Intellij Idea 2020.3.1无限试用激活补丁 PDF全能解决方案Adobe Acrobat DC 2020 SP 直装特别版
IntelliJ Idea最新版2019.3.3激活方法Windows安装版Redis Desktop Manager 2019.4下载Intellij Idea 2020.3.1无限试用激活补丁PowerDesigner 16.6的安装破解资源下载Adobe Photoshop 2020 V21.1.0.106 绿色特别版Windows安装版Redis Desktop Manager 2019.5下载三步完成PowerDesigner 16.5的安装破解汉化全能数据库管理工具Navicat 15 旗舰版x64位安装激活
Movavi Video Suite 17.4.0破解版 Office2013升级到Office2016的安装过程分析(附激活) Swagger中过滤掉任意API接口的方法 让Outlook邮件任务完美结合到Trello的方法 Intellij Idea 热部署插件JRebel 2018.1.5破解版 让Google Chrome更加安全的运行:保护Chrome中的账户资料的两种方法 Google Spaces:欢迎加入大席的博客分享讨论群 Java 8 中处理日期和时间示例
标签聚合
Google Drive 印象笔记 Windows 10 Google Chrome Evernote IntelliJ Idea 激活 Dropbox 敏捷开发 iPhone
推荐文章

COPYRIGHT © 2020 达夕博客. ALL RIGHTS RESERVED.

THEME KRATOS MADE BY VTROIS