React - How to open PDF file as a href target blank
Place the pdf into a folder in /src. Import it like a component. Set href parameter as the imported pdf and the target = "_blank".
import React, { Component } from 'react';import Pdf from '../Documents/Document.pdf';class Download extends Component { render() { return ( <div className = "App"> <a href = {Pdf} target = "_blank">Download Pdf</a> </div> ); }}export default Download;
I had to make a function to open the pdf in the new tab actually :D
import Pdf from "../../documents/resume.pdf";onResumeClick() { window.open(Pdf);}render() { return ( <a onClick={this.onResumeClick}> Resume </a>)}
Also you can use require function directly:
import React, { Component } from 'react'; class Download extends Component { render() { return ( <div className="App"> <a href={require('../Documents/Document.pdf')} target="_blank">Download Pdf</a> </div> ); } } export default Download;