Как я могу создать PDF с React-Pdf, используя PDFDownloadLink в том же компоненте? - PullRequest
Новая
       14

Как я могу создать PDF с React-Pdf, используя PDFDownloadLink в том же компоненте?

0 голосов
/ 11 марта 2020

У меня есть компонент с таблицей материалов, и мне нужно сделать PDF-файл этого содержимого.

Я пытаюсь сделать это с помощью response-pdf, но в настоящее время я печатаю пустой документ, есть способ поместить PDFDownloadLink в тот же компонент, который мне нужен для печати?

В настоящее время я отрисовываю: 

return (
        <Document>
        <PDFDownloadLink
          document={<Document />}
          fileName="movielist.pdf"
          style={{
            textDecoration: "none",
            padding: "10px",
            color: "#4a4a4a",
            backgroundColor: "#f2f2f2",
            border: "1px solid #4a4a4a"
          }}
        >
          {({ blob, url, loading, error }) =>
            loading ? "Loading document..." : "Download Pdf"
          }
        </PDFDownloadLink>
            <Page>
                <TableContainer ref={ref} component={Paper}>
                    <Table aria-label="simple table">
                     hidded content to preserve space...
                    </Table>
                <Pagination
                    className={classes.pagination}
                    count={lastPage}
                    page={page}
                    onChange={handleChangePage}
                />
            </TableContainer>
        </Page>
    </Document>
    )

Есть способ сделать ссылку на документ root которые имеют <PDFDownloadLink> и передают это в документе prop?

Я также пытаюсь создать ссылку: 

 const ref = createRef();
<Document ref={ref}>
<PDFDownloadLink
          document={ref}
          fileName="movielist.pdf"
          style={{
            textDecoration: "none",
            padding: "10px",
            color: "#4a4a4a",
            backgroundColor: "#f2f2f2",
            border: "1px solid #4a4a4a"
          }}
        >
          {({ blob, url, loading, error }) =>
            loading ? "Loading document..." : "Download Pdf"
          }
        </PDFDownloadLink>

, но таким образом я получаю эту ошибку:

Объекты недопустимы в качестве дочерних элементов React (найдено: объект с ключами {текущий}). Если вы хотите отобразить коллекцию дочерних элементов, используйте вместо этого массив.

...