How call data in react-pdf?

Question

have a project which generates a PDF, but I need to pass parameters and read it. I have searched for documentation and I have not found any that will help me.

import React from 'react';
import { Page, Text, View, Document, StyleSheet, Image} from '@react-pdf/renderer';
import logo from "./logo.png";
import firma from "./firma.png";
import imagen from "./1.jpg";    

const MyDocument = () => (
      <Document>
        <Page size="A4" style={styles.pag}>
          <View style={styles.firma}>
            <Image src={logo}/>
          </View>
          <View >
            <Text style={styles.client}>Nombre: Xxxxx Xxxxx | RUT: XX.XXX.XXX-X | Correo: xxxxx@xxxx.xxx | Teléfono: +56 9 XXXX XXXX</Text>
          </View>
          <View style={styles.imagen}>
            <Image src={imagen}/>
          </View>
          <View style={styles.info}>
            <Text style={styles.h1}>Datos de propiedad</Text>
          </View>
          <View style={styles.info}>
            <Text>UF: XX.XXX</Text>
            <Text>Tipo de propiedad: XXXXXXX</Text>
            <Text>Dirección: XXXXXX</Text>
            <Text>Metros construidos: XXXX</Text>
            <Text>Metros de terreno/terraza: XXXXX</Text>
            <Text>Dormitorios: XX</Text>
            <Text>Baños: XXX</Text>
          </View>
        </Page

The X marks the data I need to call.

Can you please create a Minimal, Reproducible Example? https://stackoverflow.com/help/minimal-reproducible-example — Pavel Shastov, Feb 13 '20 at 20:18

score 0 · Answer 1 · answered Feb 13 '20 at 21:05

Create a new state variable and store all the details in there. For ex, inside container, this.state={phone: 99999999, ... }. Then in your text tags add value attribute , example : value={this.state.phone}.

For more reference on how to pass values visit the below link:

Passing react text field input values as parameters to a method

How call data in react-pdf?

1 Answers1