要在React Router中保持侧边栏,你可以使用Layout组件来包装你的应用程序,并在其中放置侧边栏和主要内容。下面是一个示例代码:
import React from 'react';
import { BrowserRouter as Router, Switch, Route, Link } from 'react-router-dom';
const Sidebar = () => {
return (
-
Dashboard
-
Profile
-
Settings
);
};
const Dashboard = () => {
return (
Dashboard
);
};
const Profile = () => {
return (
Profile
);
};
const Settings = () => {
return (
Settings
);
};
const Layout = ({ children }) => {
return (
{children}
);
};
const App = () => {
return (
);
};
export default App;
在上面的代码中,Sidebar组件包含了侧边栏的内容,并使用Link组件来导航到不同的路由。Layout组件将Sidebar和主要内容包装在一起。在App组件中,我们使用Layout组件包裹了Switch组件,以确保侧边栏始终显示在页面上。
请注意,这只是一个示例,你可以根据自己的需求来定制侧边栏的样式和功能。