fix: 移动端点击侧边栏菜单项后自动收起抽屉
This commit is contained in:
1 parent
cef39e96c0
commit
8dd5283892
1 file changed
+6
-1
@@ -19,6 +19,11 @@ export function AppShell() {
|
||||
const libraryItems = [[History, locale.history, '/history']];
|
||||
const aboutItems = [[Info, locale.about, '/about']];
|
||||
const immersive = location.pathname === '/shorts';
|
||||
// 移动端为抽屉式侧边栏,点击任一菜单项后必须收起
|
||||
const closeSidebarOnNavigate = (event) => {
|
||||
if (!event.target.closest?.('a')) return;
|
||||
if (window.matchMedia('(max-width: 760px)').matches) setSidebarOpen(false);
|
||||
};
|
||||
useEffect(() => {
|
||||
if (!createOpen) return undefined;
|
||||
const closeMenu = (event) => {
|
||||
@@ -84,7 +89,7 @@ export function AppShell() {
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<aside className={`sidebar ${sidebarOpen ? 'open' : 'closed'}`}>
|
||||
<aside className={`sidebar ${sidebarOpen ? 'open' : 'closed'}`} onClick={closeSidebarOnNavigate}>
|
||||
<nav className="sidebar-group">
|
||||
{primaryItems.map(([Icon, label, to]) => (
|
||||
<NavLink to={to} className={() => navClass(to)} key={to}>
|
||||
|
||||
Reference in new issue
Block a user