如何在AdminJs创建或编辑记录时隐藏侧边栏？

方法一：通过自定义Layout组件控制侧边栏渲染 #

1. 创建自定义Layout组件
   在项目中新建组件文件（如src/components/CustomLayout.tsx），导入AdminJS原生Layout组件，通过路由判断当前是否为创建/编辑页面，动态控制侧边栏的显示：

import React from 'react';
import { Layout, useLocation } from 'adminjs';

const CustomLayout = (props) => {
  const location = useLocation();
  // 判断当前页面是否为创建或编辑页
  const isCreateOrEdit = location.pathname.includes('/create') || location.pathname.includes('/edit');

  return (
    <Layout
      {...props}
      sidebar={!isCreateOrEdit ? props.sidebar : null}
    />
  );
};

export default CustomLayout;

2. 在AdminJS配置中注册自定义Layout
   初始化AdminJS时，在配置项的components字段中替换默认的Layout组件：

import AdminJS from 'adminjs';
import CustomLayout from './components/CustomLayout';

const adminJs = new AdminJS({
  resources: [/* 你的业务资源配置 */],
  components: {
    Layout: CustomLayout, // 注册自定义布局
  },
});

// 后续框架路由配置（Express/NestJS等）保持原有逻辑即可

方法二：通过CSS条件隐藏侧边栏 #

如果不想修改组件渲染逻辑，也可以通过添加条件样式实现：

1. 创建带样式的自定义Layout

import React from 'react';
import { Layout, useLocation } from 'adminjs';
import './CustomLayout.css';

const CustomLayout = (props) => {
  const location = useLocation();
  const isCreateOrEdit = location.pathname.includes('/create') || location.pathname.includes('/edit');

  return (
    <div className={isCreateOrEdit ? 'hide-sidebar' : ''}>
      <Layout {...props} />
    </div>
  );
};

export default CustomLayout;

2. 添加CSS样式
   新建CustomLayout.css文件，编写隐藏侧边栏的样式：

.hide-sidebar .adminjs__sidebar {
  display: none;
}

/* 可选：让主内容区域占满整个宽度 */
.hide-sidebar .adminjs__main {
  margin-left: 0;
}

3. 同样在AdminJS配置中注册该自定义Layout，步骤同方法一。

内容的提问来源于stack exchange，提问作者Serhii Melnikov