Search code examples
javascriptpdfvue.jsvuejs2vue-component

Open a PDF using VueJS

I want to be able to open a pdf on VueJS. The pdf file is local and cannot be online.

(I'm using Quasar's button but it functions the same as a HTML button)

I have tried:

<q-btn id="mebtn" href="../assets/resume.pdf">Click Me</q-btn>

Or

<input type="button" value="Open" onClick="window.open('../assets/Resume.pdf');

Error I'm getting:

Cannot GET ../assets/Resume.pdf

I want to be able to click the button and then my pdf pops up on another tab

Other normal html solutions WILL NOT WORK

Solution

  • Assuming your directory is like:

    src -> assets --> Resume.pdf

    You can access it by:

    <input type="button" value="Open" onClick="readFile()");


methods: {
  readFile() {
     window.open('src/assets/Resume.pdf', '_blank') //to open in new tab
   }
}