ReactJS中如何将PDF文件编码为Base64字符串？代码实现求助

嘿，我来帮你搞定这个PDF转Base64的需求！其实在浏览器端处理文件编码，用原生的FileReader API就可以轻松实现，我直接在你的handleUploadFile方法里标注好修改位置，你一看就懂：

handleUploadFile(event) {
  let file = event.target.files[0];
  
  // --- 这里开始实现Base64编码 ---
  const reader = new FileReader();
  // 文件读取完成后的回调逻辑
  reader.onload = (e) => {
    // e.target.result 就是完整的Base64格式字符串（包含MIME类型前缀）
    const base64String = e.target.result;
    
    // 如果你只需要纯Base64编码内容（去掉前面的data:application/pdf;base64,），可以这么处理：
    // const pureBase64 = base64String.split(',')[1];
    
    // 更新state，把Base64字符串存起来
    this.setState({
      fileData: file,
      fileName: file.name,
      fileBase64: base64String // 新增这个state字段来存储编码后的内容
    });
  };
  // 以DataURL模式读取文件，自动生成Base64编码
  reader.readAsDataURL(file);
  // --- 编码部分结束 ---
}

额外提醒几个关键点：

• 记得提前在组件的state初始化里添加fileBase64字段，比如this.state = { fileData: null, fileName: '', fileBase64: '' }
• readAsDataURL是异步操作，所以编码结果要在onload回调里处理，不能直接在reader.readAsDataURL(file)后面拿结果
• 生成的完整Base64字符串可以直接用于显示PDF（比如放到<img>或<iframe>的src属性），或者作为数据提交给后端

内容的提问来源于stack exchange，提问作者user8998234