安装

npm install @react-pdf/renderer —save

使用

  1. import React from 'react';
  2. import { Document, Page, Text, View, StyleSheet } from '@react-pdf/renderer';
  4. // Create styles
  5. const styles = StyleSheet.create({
  6.   page: {
  7.     flexDirection: 'row',
  8.     backgroundColor: '#E4E4E4'
  9.   },
  10.   section: {
  11.     margin: 10,
  12.     padding: 10,
  13.     flexGrow: 1
  14.   }
  15. });
  17. // Create Document Component
  18. const MyDocument = () => (
  19.   <Document>
  20.     <Page size="A4" style={styles.page}>
  21.       <View style={styles.section}>
  22.         <Text>Section #1</Text>
  23.       </View>
  24.       <View style={styles.section}>
  25.         <Text>Section #2</Text>
  26.       </View>
  27.     </Page>
  28.   </Document>
  29. );

参考资料

https://react-pdf.org/
https://github.com/diegomura/react-pdf