Home > Net >  Render docx in React js
Render docx in React js

Time:04-16

I would like to properly render a docx file in React JS with the correct formatting, as it would appear in Word or a similar service. Currently, when displaying the text, all formatting is removed and appears as plain text. I obtain the file from the server, and process it, by:

          const url = "http://localhost:8080/files/aboutme.docx";

          axios.get(url, {
               responseType: 'arraybuffer',
          }).then(response => {
               var doc = new Docxtemplater(new PizZip(response.data), {delimiters: {start: 'ran', end: 'ran'}});
               var text = doc.getFullText();
               setAboutMe(text);
          })

I am using the Docxtemplater and PizZip libraries.

CodePudding user response:

Docxtemplater is

a library to generate docx/pptx documents from a docx/pptx template

If you need to render a docx file I think you should use react-doc-viewer. Then you could write something like:

import DocViewer from "react-doc-viewer";

function App() {
  const doc = [{ uri: "http://localhost:8080/files/aboutme.docx" }];

  return <DocViewer documents={doc} />;
} 
  • Related