将本机 base64 反应为 pdf 展览打印

Posted 2023-02-22

【中文标题】将本机 base64 反应为 pdf 展览打印

【英文标题】：React native base64 to pdf expo print

【发布时间】：2021-08-16 00:06:49

【问题描述】：

我想在 react 本机移动应用程序上打印一个 pdf 文件，我从 api 收到一个 base64 代码，并通过使用它向客户展示他/她的发票 pdf。我尝试使用 Expo Print 但我无法处理它，我不断收到

错误：对象作为 React 子对象无效（找到：带有键 _40、_65、_55、_72 的对象）。如果您打算渲染一组子项，请改用数组。]

我将不胜感激！

import React,  Component  from 'react';
import  View, Text, Button, StyleSheet,TouchableHighlight  from 'react-native';
import RNhtmltoPDF from 'react-native-html-to-pdf';
import * as Print from 'expo-print';

const InvoiceScreen = async( route, navigation ) => 
  const  invoice = route.params;
  const my_uri = "data:application/pdf;base64"+invoice
  console.log("DID INVIOCE COMEEE",invoice)
  await   Print.printAsync(
    uri:my_uri,
      width: 595, height: 842 )
    return (
      <View></View>
      );
;

export default InvoiceScreen;

【问题讨论】：

我解决了这个问题，这是由于函数的异步方法，我删除异步后它起作用了。如果有人正在寻找答案:)

【参考方案1】：

用这个替换你的代码：

const InvoiceScreen = async( route, navigation ) => 
  const  invoice  = route.params;
  const my_uri = `data:application/pdf;base64,$invoice`;
  await Print.printAsync(uri:my_uri);
;

export default InvoiceScreen;

【讨论】：

您好，感谢您的回答，但它不起作用:(我仍然得到相同的错误：对象作为 React 子项无效（找到：带有键 _40、_65、_55、_72 的对象） . 如果您打算渲染一组子项，请改用数组。] @F***

【参考方案2】：

可能问题出在“invoice”参数的数据类型上，它必须是一个字符串，它必须是 pdf 文件的 base64。 Reference

如果您使用 Expo - 托管工作流程（Expo CLI / 工具），要查看 pdf，我建议您使用 https://www.npmjs.com/package/rn-pdf-reader-js 我还留下了一个简单的实现：

import React from "react";
import  View, StyleSheet, Dimensions  from "react-native";
import  globalStyles  from "../../constants/globalStyles";
import PDFReader from "rn-pdf-reader-js";

export default function XScreen( navigation, route ) 

  return (
    <View style=globalStyles.backGround>
      <PDFReader
        source=
          base64: route.params.source,
        
        style=styles.pdf
      />
    </View>
  );

const styles = StyleSheet.create(
  pdf: 
    flex: 1,
    width: Dimensions.get("window").width,
    height: Dimensions.get("window").height,
  ,
);

注意：

route.params.source = data:application/pdf;base64,$response.data.data; response.data.data = string base64 pdf