Reactjs 我在使用相对路径时遇到困难。基本路径将从位置栏中消失

我部署了一个webapp，其根目录位于路径

/exist/apps/my app/

中。我为App.js实现了以下代码：

import React from 'react';
import Navbar from 'react-bootstrap/Navbar';
import Nav from 'react-bootstrap/Nav';
import {
    BrowserRouter as Router,
    Switch,
    Route,
    Link
} from "react-router-dom";
import 'bootstrap/dist/css/bootstrap.min.css';
import './App.css';


function App() {
  return (
        <Router basename={process.env.PUBLIC_URL}>
            <Navbar bg="dark" variant="dark" fixed="top">
                <Navbar.Brand href="/"><img alt="" src="https://avatars3.githubusercontent.com/u/2393489?s=200&v=4" weign="40" height="40"/> My React Application</Navbar.Brand>
                <Nav className="mr-auto">
                    <Link to="/" className="nav-link">Home</Link>
                    <Link to="/features" className="nav-link">Features</Link>
                    <Link to="/pricing" className="nav-link">Pricing</Link>
                </Nav>
            </Navbar>
            <div className="full">
                <Switch>
                    <Route path="/features">
                        <h1>Features</h1>
                    </Route>
                    <Route path="/pricing">
                        <h1>Pricing</h1>
                    </Route>
                    <Route path="/">
                        <h1>Home</h1>
                    </Route>
                </Switch>
            </div>
        </Router>
  );
}

export default App;

从“React”导入React；
从“react引导/Navbar”导入Navbar；
从“反应引导/Nav”导入Nav；
进口{
BrowserRouter作为路由器，
转换
路线,，
链接
}从“反应路由器dom”；
导入'bootstrap/dist/css/bootstrap.min.css'；
导入“/App.css”；
函数App（）{
返回(
我的React应用程序
家
特征
定价
特征
定价
家
);
}
导出默认应用程序；

---

单击导航链接可导航到正确的路由，但

/exist/apps/my app

将从显示的URL中消失。如何在位置栏中保留URL缺少的部分？

process.env.PUBLIC\u URL

仅包含句点

我找到了两个解决办法

首先是硬编码

basename={'/exist/apps/myapp'}

第二种也是更好的方法是一起消除

basename

，并将

BrowserRouter

更改为

HashRouter

我最终找到了第二种方法，并且能够为包含路由的URL添加书签

签出ExistDB web应用程序示例