Reactstrap Navbar到PDF的链接不起作用

时间:2018-08-07 03:35:51

标签: javascript reactjs reactstrap

由于某种原因,我无法获得此指向PDF的简单链接才能正常工作。我正在使用react,带bootstrap css的reactstrap导航栏。这是我的问题的一个示例:https://codesandbox.io/s/n3yqk17q8l

我一定缺少简单的东西。谢谢您的宝贵时间!

import React from "react";
import ReactDOM from "react-dom";
import {
Collapse,
Navbar,
NavbarToggler,
NavbarBrand,
Nav,
NavItem,
NavLink
} from "reactstrap";
import "bootstrap/dist/css/bootstrap.min.css";

import "./styles.css";

function App() {
return (
    <div style={{ width: "100%" }}>
    <Navbar color="dark" dark expand="sm">
        <NavbarBrand href="/">Brand</NavbarBrand>
        <NavbarToggler />
        <Collapse navbar>
        <Nav className="mr-auto" navbar>
            <NavItem>
            <NavLink href="/sample.pdf">
                <span className="fa fa-fw fa-file-pdf" /> PDF
            </NavLink>
            </NavItem>
        </Nav>
        </Collapse>
    </Navbar>
    </div>
);
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

1 个答案:

答案 0 :(得分:0)

<NavLink href="/sample.pdf">

您需要从此网址中删除点。您是否有任何理由需要在pdf链接中包含点? 例如,这将起作用

 <NavLink href="/sample">