Fix: pass location search

This commit is contained in:
Dreamacro 2022-04-24 11:04:14 +08:00
parent d0f61c9c57
commit 81362b0816
2 changed files with 7 additions and 4 deletions

View File

@ -1,5 +1,5 @@
import classnames from 'classnames' import classnames from 'classnames'
import { Route, Navigate, Routes } from 'react-router-dom' import { Route, Navigate, Routes, useLocation } from 'react-router-dom'
// import Overview from '@containers/Overview' // import Overview from '@containers/Overview'
import Connections from '@containers/Connections' import Connections from '@containers/Connections'
@ -18,6 +18,8 @@ import '../styles/iconfont.scss'
export default function App () { export default function App () {
useLogsStreamReader() useLogsStreamReader()
const location = useLocation()
const routes = [ const routes = [
// { path: '/', name: 'Overview', component: Overview, exact: true }, // { path: '/', name: 'Overview', component: Overview, exact: true },
{ path: '/proxies', name: 'Proxies', element: <Proxies /> }, { path: '/proxies', name: 'Proxies', element: <Proxies /> },
@ -32,7 +34,7 @@ export default function App () {
<SideBar routes={routes} /> <SideBar routes={routes} />
<div className="page-container"> <div className="page-container">
<Routes> <Routes>
<Route path="/" element={<Navigate to="/proxies" replace />} /> <Route path="/" element={<Navigate to={{ pathname: '/proxies', search: location.search }} replace />} />
{ {
routes.map( routes.map(
route => <Route path={route.path} key={route.path} element={route.element} />, route => <Route path={route.path} key={route.path} element={route.element} />,

View File

@ -1,5 +1,5 @@
import classnames from 'classnames' import classnames from 'classnames'
import { NavLink } from 'react-router-dom' import { NavLink, useLocation } from 'react-router-dom'
import logo from '@assets/logo.png' import logo from '@assets/logo.png'
import { Lang, Language } from '@i18n' import { Lang, Language } from '@i18n'
@ -20,11 +20,12 @@ export default function Sidebar (props: SidebarProps) {
const { version, premium } = useVersion() const { version, premium } = useVersion()
const { data } = useClashXData() const { data } = useClashXData()
const { t } = translation('SideBar') const { t } = translation('SideBar')
const location = useLocation()
const navlinks = routes.map( const navlinks = routes.map(
({ path, name, noMobile }) => ( ({ path, name, noMobile }) => (
<li className={classnames('item', { 'no-mobile': noMobile })} key={name}> <li className={classnames('item', { 'no-mobile': noMobile })} key={name}>
<NavLink to={path} className={({ isActive }) => classnames({ active: isActive })}> <NavLink to={{ pathname: path, search: location.search }} className={({ isActive }) => classnames({ active: isActive })}>
{ t(name as keyof typeof Language[Lang]['SideBar']) } { t(name as keyof typeof Language[Lang]['SideBar']) }
</NavLink> </NavLink>
</li> </li>