Open pdf present inside project directory in new window [Vue]

Question

So I am working on this Vue project which contains a terms.pdf inside the project directory. Now what I want is to provide a link on one of the components (which contains the code written below) and when this link is clicked, a new browser window should pop up with the terms.pdf opened inside it.

<v-checkbox
  v-model="accept"
  color="#0b419a"
  hide-details
>
  <div slot="label">
    I accept the <span class="link">Terms and conditions</span>
  </div>
</v-checkbox>

What I want here is when I click the <span class="link">Terms and conditions</span> It opens a new browser window with terms.pdf opened inside it.

The path for terms.pdf relative to this file, inside the project, is "./../../assets/pdfs/terms.pdf".

What I tried is several other Stack overflow answers with <a href> <iframe> tags, etc. But all of them redirect me to my project's home page with the URL changed.

URL Changed means suppose before clicking the link, the URL was domain/#/componentRouteName. Now after clicking the link it redirects me to the home page of the project with the URL changed to domain/terms.pdf#/homePageRouteName

I tried target="_blank" as well but doesn't work at all.

So my overall doubt is:

Is this even possible with the UI / frontend side alone or does it require the backend support as well to achieve the same? If the frontend part alone is enough to achieve, please guide me with the solutions or redirect me to the explanations around the web.

Thanks for your time and answers !!