feat: add disableContentMargin props

ant-design · Nov 26, 2019 · 1456cce · 1456cce
1 parent c77c033
commit 1456cce
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 1 deletion.
diff --git a/example/src/layouts/BasicLayout.tsx b/example/src/layouts/BasicLayout.tsx
@@ -41,7 +41,7 @@ const BasicLayout: React.FC<BasicLayoutProps> = props => {
         rightContentRender={rightProps => (
           <RightContent {...rightProps} {...settings} />
         )}
-        contentStyle={{ margin: 0 }}
+        disableContentMargin
       >
         <ProLayout
           navTheme="light"

diff --git a/src/BasicLayout.less b/src/BasicLayout.less
@@ -22,6 +22,9 @@
     .ant-layout {
       transform: rotate(0);
     }
+    &-disable-margin {
+      margin: 0;
+    }
   }
 
   // default children layout height

diff --git a/src/BasicLayout.tsx b/src/BasicLayout.tsx
@@ -113,6 +113,11 @@ export interface BasicLayoutProps
   isChildrenLayout?: boolean;
 
   className?: string;
+
+  /**
+   * 兼用 content的 margin
+   */
+  disableContentMargin: boolean;
 }
 
 const headerRender = (props: BasicLayoutProps): React.ReactNode => {
@@ -224,6 +229,7 @@ const BasicLayout: React.FC<BasicLayoutProps> = props => {
       routes: [],
     },
     style,
+    disableContentMargin,
     siderWidth = 256,
     menu,
     isChildrenLayout: propsIsChildrenLayout,
@@ -384,6 +390,7 @@ Pro-Layout 在 4.7 中支持了 subMenu 的 render, 会导致 menu 变成蓝色
 
   const contentClassName = classNames('ant-pro-basicLayout-content', {
     'ant-pro-basicLayout-has-header': headerDom,
+    'ant-pro-basicLayout-content-disable-margin': disableContentMargin,
   });
 
   return (