简体   繁体   English

从反应js中的url react-router-dom中删除#

[英]remove # from url react-router-dom in react js

I am new in react.js I am using react-router-dom v6 and I working on a theme where I find an issue with # in URL我是 react.js 的新手,我正在使用 react-router-dom v6,我正在研究一个主题,我发现 URL 中的 # 存在问题

Example:- {url}/#/dashboard示例:- {url}/#/dashboard

I want Example:- {url}/dashboard我想要示例:- {url}/dashboard

am assuming, you are using HashRouter if yes then please use BrowserRouter instead HashRouter我假设,如果是,您正在使用 HashRouter,那么请使用 BrowserRouter 而不是 HashRouter

implement BrowserRouter on routing在路由上实现 BrowserRouter

import { BrowserRouter,Route, Routes } from 'react-router-dom'
render(
<BrowserRouter>
<Routes>....</Routes>
</BrowserRouter>)

You have to use BrowserRouter instead of HashRouter from react-router-dom您必须使用BrowserRouter而不是来自react-router-domHashRouter

In your App.js file, try like below.在您的App.js文件中,尝试如下所示。

import { BrowserRouter, Routes, Route } from 'react-router-dom';
import LandingPage from './Containers/LandingPage';

const App = () => {
  return (
    <BrowserRouter className='App'>
      <Routes>
        <Route exact path='/' element={<LandingPage />} />
      </Routes>
      <Routes>
        <Route ... ... />
      </Routes>
      ... ...
    </BrowserRouter>
  );
}

export default App;
I think you have to use BrowserRouter instead of HashRouter

1. You can add it in your index.js or index.tsx depending on your project.

import { BrowserRouter } from 'react-router-dom'

root.render(
<BrowserRouter>
<App/>
</BrowserRouter>)

2. You can also add in your App.js or App.tsx depending 

import { BrowserRouter,Routes,Route } from 'react-router-dom'

const App = () => {
  return (
    <BrowserRouter className='main'>
      <Routes>
        <Route exact path='/' element={<Home />} />
      </Routes>
      <Routes>
      </Routes>
    </BrowserRouter>
  );
}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM