I
I
Islam Ibakaev2018-11-01 22:41:26
JavaScript
Islam Ibakaev, 2018-11-01 22:41:26

How to generate pdf from or html string(or template)?

Here's what I've sketched out so far, and this is the code.

<div id="root">
  <div class="container">
    <div class="row">
      <div class="col-sm-6">
        <input type="text" v-model="text">
      </div>
      <div class="col-sm-6">
        <object id="pdf_viewer" type="application/pdf" :data="output" width="100%" height="400"></object>
      </div>
    </div>
  </div>
</div>

new Vue({
  el: "#root",

  data: {
    text: "Hello Kitty"
  },

  computed: {
    output() {
      const pdf = new jsPDF();
      pdf.text(this.text, 10, 10);
      return pdf.output("datauristring");
    }
  }
});

But what if you need to pass html and css or immediately a vue component:
<div class="container">
  <div class="logo"><img src="/img/logo" alt="logo"></div>
  
  <h1 class="heading">{{ this.text }}</h1>
  
  <div class="row">
    <div class="col-md-4">какой-то контент</div>
    <div class="col-md-4">какой-то контент</div>
    <div class="col-md-4">какой-то контент</div>
  </div>
</div>

If we talk about the component, we need to first compile it into an html string and pass it to jspdf.
Tell me how to do this: translate the component into an html string and how to create a pdf with such content using jspdf?

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question