refactor:布局组件新增margin/padding样式属性

Author: wocwin

packages/layout-page-item/src/index.vue

@@ -2,7 +2,7 @@
   <section
     id="t_layout_page_item"
     class="t_layout_page_item"
-    :class="{ 't_layout_page_item_bottm_margin': isNoBottomMargin}"
+    :class="{ 'page_item_no_margin': isNoMargin}"
   >
     <slot />
   </section>
@@ -11,7 +11,7 @@
 export default {
   name: 'TLayoutPageItem',
   props: {
-    isNoBottomMargin: {
+    isNoMargin: {
       type: Boolean,
       default: false
     }
@@ -20,12 +20,12 @@ export default {
 </script>
 <style lang="scss" scoped>
 .t_layout_page_item {
-  // margin: 8px;
   padding: 16px;
   background: #fff;
   border-radius: 4px;
-  &.t_layout_page_item_bottm_margin {
-    margin-bottom: 0;
+  &.page_item_no_margin {
+    margin: 0;
+    padding: 0;
   }
 }
 </style>

packages/layout-page/src/index.vue

@@ -2,6 +2,7 @@
   <div
     id="t_layout_page"
     class="t_layout_page"
+    :class="{ layout_page_no_margin: isNoMargin }"
     ref="TLayoutPageRef"
     @scroll="(e) => (scrollTop = e.target.scrollTop)"
   >
@@ -18,6 +19,10 @@ export default {
   name: 'TLayoutPage',
   props: {
     keepScrollDisabled: Boolean,
+    isNoMargin: {
+      type: Boolean,
+      default: false
+    },
     // 是否显示返回顶部按钮
     showGoTopButton: {
       type: Boolean,
@@ -110,4 +115,7 @@ export default {
     }
   }
 }
+.layout_page_no_margin {
+  padding: 0;
+}
 </style>