javascript - 如何在 React 中引用 pdf 文件

Question

我有一个 Reactjs SPA，其文件结构如下所示:

在该应用程序中有一个简单的组件(Resume.js)，我希望用户能够在浏览器中查看/下载 pdf 文件(resume_english.pdf) >)。然而，我无法在本地或在我计划托管 SPA 的 GitHub 页面中执行此操作。它总是将我重定向到主页。

Resume.js 看起来像这样:

import React, {Component} from 'react';

class Resume extends Component {
    constructor(props) {
        super(props);

        this.state = {};
    }

    render() {
        return (
            <div className={'resume-container'}>
                <div id={'resume-pdf'}>You can view, download and print my résumé in pdf format in <a
                    href={'./public/resume_english.pdf'}>English</a> and <a href={'#'}>Spanish</a></div>
            </div>
        );
    }
}

export default Resume;

关于如何解决这个问题有什么想法吗？我已经尝试过像 this 那样导入，但没有成功。

Answer 1

看起来这是用 create-react-app 制作的。如果是这样，public 目录中的文件将被复制到 build 中，并且 build 目录将作为您网站的根目录。因此，适当的 href 是 /resume_english.pdf。

尝试直接在浏览器中输入网址。类似 http://localhost:3000/resume_english.pdf 或 https://danielsto.github.io/resume_english.pdf