react实现文件转base64的方法：1、安装reactfilereader插件；2、引入reactfilereader；3、书写好页面方法；4、获取上传的图片的base64地址即可。
本文操作环境：windows7系统、react17.0.1、dell g3。
react怎么实现文件转base64?
react上传文件转base64
前言：       react有一个第三方插件 reactfilereader   可以实现这个功能。实现步骤：1.安装插件  npm install react-file-reader --save
2.代码引入import reactfilereader from react-file-reader;3.写页面方法<reactfilereader filetypes={[".png",".jpg",".gif", "jpeg"]} base64 multiplefiles={!1} handlefiles={this.handlefiles}>    <button>        <icon type="upload" /> 选择文件    </button></reactfilereader>// 获取上传的图片的base64地址handlefiles = (files) => {    console.log(files.base64);}
api:官网入口usageimport react file readerimport reactfilereader from 'react-file-reader';
basic usehandlefiles = files => {  console.log(files)}<reactfilereader handlefiles={this.handlefiles}>  <button classname='btn'>upload</button></reactfilereader>response
html5 filelist
base64when base64 is true, react file reader returns a js object including both the base64 files and the html5 filelist. you can access their values at object.base64 or object.filelist
handlefiles = (files) => {  console.log(files.base64)}<reactfilereader filetypes={[".csv",".zip"]} base64={true} multiplefiles={true} handlefiles={this.handlefiles}>  <button classname='btn'>upload</button></reactfilereader>
response
multiplefiles={true}
[data:image/png;base64,ivborw0kggoaaaansuheugaaa, data:image/png;base64,i...]
multiplefiles={false}
  data:image/png;base64,ivborw0kggoaaaansuheugaaa...
access html5 filelist with base64={true}
handlefiles = (files) => {  console.log(files.filelist)}
推荐学习：《react视频教程》 
以上就是react怎么实现文件转base64的详细内容。