From ac7edf81481af3f8b2e7c21ba51c2d5a64d2caca Mon Sep 17 00:00:00 2001
From: Y <anly_yaw@163.com>
Date: Tue, 15 Aug 2023 11:26:12 +0800
Subject: [PATCH] fix(CellGroup): resolved bordered invalid (#1010)

* fix(CellGroup): resolved bordered invalid

* test: update snapshots
---
 .../__test__/__snapshots__/demo.test.jsx.snap | 1483 +++++++++--------
 src/cell/cell-group-props.ts                  |    5 +-
 src/cell/cell-group.vue                       |   17 +-
 src/cell/cell.en-US.md                        |    2 +-
 src/cell/cell.md                              |    2 +-
 src/cell/type.ts                              |    1 +
 .../__test__/__snapshots__/demo.test.jsx.snap |   64 +-
 .../__test__/__snapshots__/demo.test.jsx.snap |    4 +-
 8 files changed, 820 insertions(+), 758 deletions(-)

diff --git a/src/cell/__test__/__snapshots__/demo.test.jsx.snap b/src/cell/__test__/__snapshots__/demo.test.jsx.snap
index d4e62dc66..5dce79c41 100644
--- a/src/cell/__test__/__snapshots__/demo.test.jsx.snap
+++ b/src/cell/__test__/__snapshots__/demo.test.jsx.snap
@@ -2,179 +2,185 @@
 
 exports[`Cell > Cell groupVue demo works fine 1`] = `
 <div
-  class="t-cell-group t-cell-group--card"
+  data-v-app=""
 >
-  <!--v-if-->
   
+  <!--v-if-->
   <div
-    class="t-cell t-cell--middle"
+    class="t-cell-group t-cell-group--card"
   >
+    
     <div
-      class="t-cell__left"
+      class="t-cell t-cell--middle"
     >
       <div
-        class="t-cell__left-icon"
-      >
-        <svg
-          class="t-icon t-icon-lock-on"
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
+        class="t-cell__left"
+      >
+        <div
+          class="t-cell__left-icon"
         >
-          <path
-            d="M6 10v1h4v-1H6z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-          <path
-            d="M4.5 5v1H3a.5.5 0 00-.5.5v7c0 .28.22.5.5.5h10a.5.5 0 00.5-.5v-7A.5.5 0 0013 6h-1.5V5a3.5 3.5 0 00-7 0zm6 1h-5V5a2.5 2.5 0 015 0v1zm-7 1h9v6h-9V7z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
+          <svg
+            class="t-icon t-icon-lock-on"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M6 10v1h4v-1H6z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+            <path
+              d="M4.5 5v1H3a.5.5 0 00-.5.5v7c0 .28.22.5.5.5h10a.5.5 0 00.5-.5v-7A.5.5 0 0013 6h-1.5V5a3.5 3.5 0 00-7 0zm6 1h-5V5a2.5 2.5 0 015 0v1zm-7 1h9v6h-9V7z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </div>
+        <!---->
+      </div>
+      <div
+        class="t-cell__title"
+      >
+        单行标题
+        <!--v-if-->
+        <!--v-if-->
       </div>
-      <!---->
-    </div>
-    <div
-      class="t-cell__title"
-    >
-      单行标题
-      <!--v-if-->
       <!--v-if-->
-    </div>
-    <!--v-if-->
-    <div
-      class="t-cell__right"
-    >
       <div
-        class="t-cell__right-icon"
-      >
-        <svg
-          class="t-icon t-icon-chevron-right"
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
+        class="t-cell__right"
+      >
+        <div
+          class="t-cell__right-icon"
         >
-          <path
-            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
+          <svg
+            class="t-icon t-icon-chevron-right"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </div>
       </div>
     </div>
-  </div>
-  <div
-    class="t-cell t-cell--middle"
-  >
     <div
-      class="t-cell__left"
+      class="t-cell t-cell--middle"
     >
       <div
-        class="t-cell__left-icon"
-      >
-        <svg
-          class="t-icon t-icon-service"
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
+        class="t-cell__left"
+      >
+        <div
+          class="t-cell__left-icon"
         >
-          <path
-            d="M2.52 6.37a5.5 5.5 0 0110.98.13v4c0 .05 0 .1-.02.15A4.5 4.5 0 019 14.7H8v-1h1a3.5 3.5 0 003.4-2.7h-1.9a.5.5 0 01-.5-.5v-4c0-.28.22-.5.5-.5h1.93a4.5 4.5 0 00-8.86 0H5.5c.28 0 .5.22.5.5v4a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5v-4c0-.04 0-.09.02-.13zM12.5 7H11v3h1.5V7zm-9 0v3H5V7H3.5z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
+          <svg
+            class="t-icon t-icon-service"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M2.52 6.37a5.5 5.5 0 0110.98.13v4c0 .05 0 .1-.02.15A4.5 4.5 0 019 14.7H8v-1h1a3.5 3.5 0 003.4-2.7h-1.9a.5.5 0 01-.5-.5v-4c0-.28.22-.5.5-.5h1.93a4.5 4.5 0 00-8.86 0H5.5c.28 0 .5.22.5.5v4a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5v-4c0-.04 0-.09.02-.13zM12.5 7H11v3h1.5V7zm-9 0v3H5V7H3.5z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </div>
+        <!---->
+      </div>
+      <div
+        class="t-cell__title"
+      >
+        单行标题
+        <!--v-if-->
+        <!--v-if-->
       </div>
-      <!---->
-    </div>
-    <div
-      class="t-cell__title"
-    >
-      单行标题
-      <!--v-if-->
       <!--v-if-->
-    </div>
-    <!--v-if-->
-    <div
-      class="t-cell__right"
-    >
       <div
-        class="t-cell__right-icon"
-      >
-        <svg
-          class="t-icon t-icon-chevron-right"
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
+        class="t-cell__right"
+      >
+        <div
+          class="t-cell__right-icon"
         >
-          <path
-            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
+          <svg
+            class="t-icon t-icon-chevron-right"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </div>
       </div>
     </div>
-  </div>
-  <div
-    class="t-cell t-cell--middle"
-  >
     <div
-      class="t-cell__left"
+      class="t-cell t-cell--middle"
     >
       <div
-        class="t-cell__left-icon"
-      >
-        <svg
-          class="t-icon t-icon-internet"
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
+        class="t-cell__left"
+      >
+        <div
+          class="t-cell__left-icon"
         >
-          <path
-            d="M1.1 7.9a6.9 6.9 0 1113.8 0v.2a6.9 6.9 0 11-13.8 0v-.2zm12.79.6h-3a9.86 9.86 0 01-1.96 5.43A5.9 5.9 0 0013.9 8.5zm-3-1h3a5.9 5.9 0 00-4.96-5.43A9.86 9.86 0 0110.9 7.5zm-1 0A8.87 8.87 0 008 2.5a8.87 8.87 0 00-1.89 5H9.9zm-4.78 1h-3a5.9 5.9 0 004.96 5.43A9.86 9.86 0 015.1 8.5zm0-1c.1-1.92.75-3.82 1.96-5.43A5.9 5.9 0 002.1 7.5h3zm4.78 1H6.1c.1 1.78.73 3.53 1.89 5a8.87 8.87 0 001.89-5z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
+          <svg
+            class="t-icon t-icon-internet"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M1.1 7.9a6.9 6.9 0 1113.8 0v.2a6.9 6.9 0 11-13.8 0v-.2zm12.79.6h-3a9.86 9.86 0 01-1.96 5.43A5.9 5.9 0 0013.9 8.5zm-3-1h3a5.9 5.9 0 00-4.96-5.43A9.86 9.86 0 0110.9 7.5zm-1 0A8.87 8.87 0 008 2.5a8.87 8.87 0 00-1.89 5H9.9zm-4.78 1h-3a5.9 5.9 0 004.96 5.43A9.86 9.86 0 015.1 8.5zm0-1c.1-1.92.75-3.82 1.96-5.43A5.9 5.9 0 002.1 7.5h3zm4.78 1H6.1c.1 1.78.73 3.53 1.89 5a8.87 8.87 0 001.89-5z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </div>
+        <!---->
+      </div>
+      <div
+        class="t-cell__title"
+      >
+        单行标题
+        <!--v-if-->
+        <!--v-if-->
       </div>
-      <!---->
-    </div>
-    <div
-      class="t-cell__title"
-    >
-      单行标题
-      <!--v-if-->
       <!--v-if-->
-    </div>
-    <!--v-if-->
-    <div
-      class="t-cell__right"
-    >
       <div
-        class="t-cell__right-icon"
-      >
-        <svg
-          class="t-icon t-icon-chevron-right"
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
+        class="t-cell__right"
+      >
+        <div
+          class="t-cell__right-icon"
         >
-          <path
-            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
+          <svg
+            class="t-icon t-icon-chevron-right"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </div>
       </div>
     </div>
+    
   </div>
   
 </div>
@@ -219,11 +225,11 @@ exports[`Cell > Cell mobileVue demo works fine 1`] = `
       class="tdesign-mobile-demo-block__slot"
     >
       
+      
+      <!--v-if-->
       <div
-        class="t-cell-group t-cell-group--default"
-        data-v-f4324ab6=""
+        class="t-cell-group t-cell-group--default t-cell-group--bordered"
       >
-        <!--v-if-->
         
         <div
           class="t-cell t-cell--middle"
@@ -512,6 +518,7 @@ exports[`Cell > Cell mobileVue demo works fine 1`] = `
         
       </div>
       
+      
     </div>
   </div>
   <div
@@ -532,11 +539,11 @@ exports[`Cell > Cell mobileVue demo works fine 1`] = `
       class="tdesign-mobile-demo-block__slot"
     >
       
+      
+      <!--v-if-->
       <div
         class="t-cell-group t-cell-group--default"
-        data-v-f4324ab6=""
       >
-        <!--v-if-->
         
         <div
           class="t-cell t-cell--middle"
@@ -1038,6 +1045,7 @@ exports[`Cell > Cell mobileVue demo works fine 1`] = `
         
       </div>
       
+      
     </div>
   </div>
   <div
@@ -1062,11 +1070,11 @@ exports[`Cell > Cell mobileVue demo works fine 1`] = `
       class="tdesign-mobile-demo-block__slot"
     >
       
+      
+      <!--v-if-->
       <div
         class="t-cell-group t-cell-group--card"
-        data-v-f4324ab6=""
       >
-        <!--v-if-->
         
         <div
           class="t-cell t-cell--middle"
@@ -1241,6 +1249,7 @@ exports[`Cell > Cell mobileVue demo works fine 1`] = `
         
       </div>
       
+      
     </div>
   </div>
 </div>
@@ -1248,506 +1257,512 @@ exports[`Cell > Cell mobileVue demo works fine 1`] = `
 
 exports[`Cell > Cell multipleVue demo works fine 1`] = `
 <div
-  class="t-cell-group t-cell-group--default"
+  data-v-app=""
 >
-  <!--v-if-->
   
+  <!--v-if-->
   <div
-    class="t-cell t-cell--middle"
+    class="t-cell-group t-cell-group--default"
   >
+    
     <div
-      class="t-cell__left"
-    >
-      <!--v-if-->
-      <!---->
-    </div>
-    <div
-      class="t-cell__title"
+      class="t-cell t-cell--middle"
     >
-      单行标题
-      <!--v-if-->
       <div
-        class="t-cell__description"
+        class="t-cell__left"
       >
-        一段很长很长的内容文字
+        <!--v-if-->
+        <!---->
       </div>
-    </div>
-    <!--v-if-->
-    <div
-      class="t-cell__right"
-    >
       <div
-        class="t-cell__right-icon"
-      >
-        <svg
-          class="t-icon t-icon-chevron-right"
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
+        class="t-cell__title"
+      >
+        单行标题
+        <!--v-if-->
+        <div
+          class="t-cell__description"
         >
-          <path
-            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
+          一段很长很长的内容文字
+        </div>
       </div>
-    </div>
-  </div>
-  <div
-    class="t-cell t-cell--middle"
-  >
-    <div
-      class="t-cell__left"
-    >
       <!--v-if-->
-      <!---->
-    </div>
-    <div
-      class="t-cell__title"
-    >
-      单行标题
-      <span
-        class="t-cell--required"
-      >
-         *
-      </span>
       <div
-        class="t-cell__description"
+        class="t-cell__right"
       >
-        一段很长很长的内容文字
+        <div
+          class="t-cell__right-icon"
+        >
+          <svg
+            class="t-icon t-icon-chevron-right"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </div>
       </div>
     </div>
-    <!--v-if-->
     <div
-      class="t-cell__right"
+      class="t-cell t-cell--middle"
     >
       <div
-        class="t-cell__right-icon"
-      >
-        <svg
-          class="t-icon t-icon-chevron-right"
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
+        class="t-cell__left"
+      >
+        <!--v-if-->
+        <!---->
+      </div>
+      <div
+        class="t-cell__title"
+      >
+        单行标题
+        <span
+          class="t-cell--required"
         >
-          <path
-            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
+           *
+        </span>
+        <div
+          class="t-cell__description"
+        >
+          一段很长很长的内容文字
+        </div>
       </div>
-    </div>
-  </div>
-  <div
-    class="t-cell t-cell--middle"
-  >
-    <div
-      class="t-cell__left"
-    >
-      <!--v-if-->
-      <!---->
-    </div>
-    <div
-      class="t-cell__title"
-    >
-      单行标题
       <!--v-if-->
       <div
-        class="t-cell__description"
+        class="t-cell__right"
       >
-        一段很长很长的内容文字
+        <div
+          class="t-cell__right-icon"
+        >
+          <svg
+            class="t-icon t-icon-chevron-right"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </div>
       </div>
     </div>
     <div
-      class="t-cell__note"
+      class="t-cell t-cell--middle"
     >
-      
       <div
-        class="t-badge"
+        class="t-cell__left"
+      >
+        <!--v-if-->
+        <!---->
+      </div>
+      <div
+        class="t-cell__title"
       >
+        单行标题
+        <!--v-if-->
         <div
-          class="t-badge__content"
+          class="t-cell__description"
         >
-          <!---->
+          一段很长很长的内容文字
         </div>
+      </div>
+      <div
+        class="t-cell__note"
+      >
+        
         <div
-          class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count"
+          class="t-badge"
         >
-          <!--v-if-->
-           16 
-          <!--v-if-->
+          <div
+            class="t-badge__content"
+          >
+            <!---->
+          </div>
+          <div
+            class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count"
+          >
+            <!--v-if-->
+             16 
+            <!--v-if-->
+          </div>
+          <!---->
         </div>
-        <!---->
+        
       </div>
-      
-    </div>
-    <div
-      class="t-cell__right"
-    >
       <div
-        class="t-cell__right-icon"
-      >
-        <svg
-          class="t-icon t-icon-chevron-right"
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
+        class="t-cell__right"
+      >
+        <div
+          class="t-cell__right-icon"
         >
-          <path
-            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
+          <svg
+            class="t-icon t-icon-chevron-right"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </div>
       </div>
     </div>
-  </div>
-  <div
-    class="t-cell t-cell--middle"
-  >
-    <div
-      class="t-cell__left"
-    >
-      <!--v-if-->
-      <!---->
-    </div>
     <div
-      class="t-cell__title"
+      class="t-cell t-cell--middle"
     >
-      单行标题
-      <!--v-if-->
       <div
-        class="t-cell__description"
+        class="t-cell__left"
       >
-        一段很长很长的内容文字
+        <!--v-if-->
+        <!---->
+      </div>
+      <div
+        class="t-cell__title"
+      >
+        单行标题
+        <!--v-if-->
+        <div
+          class="t-cell__description"
+        >
+          一段很长很长的内容文字
+        </div>
       </div>
-    </div>
-    <div
-      class="t-cell__note"
-    >
-      
       <div
-        class="t-switch t-switch--medium t-switch--checked"
+        class="t-cell__note"
       >
+        
         <div
-          class="t-switch__dot t-switch__dot--medium t-switch__dot--checked t-switch__dot--plain"
+          class="t-switch t-switch--medium t-switch--checked"
         >
           <div
-            class="t-switch__label t-switch__label--medium t-switch__label--checked"
+            class="t-switch__dot t-switch__dot--medium t-switch__dot--checked t-switch__dot--plain"
           >
-            <!--v-if-->
-            <!---->
+            <div
+              class="t-switch__label t-switch__label--medium t-switch__label--checked"
+            >
+              <!--v-if-->
+              <!---->
+            </div>
           </div>
         </div>
+        
       </div>
-      
-    </div>
-    <!--v-if-->
-  </div>
-  <div
-    class="t-cell t-cell--middle"
-  >
-    <div
-      class="t-cell__left"
-    >
       <!--v-if-->
-      <!---->
     </div>
     <div
-      class="t-cell__title"
+      class="t-cell t-cell--middle"
     >
-      单行标题
-      <!--v-if-->
       <div
-        class="t-cell__description"
+        class="t-cell__left"
       >
-        一段很长很长的内容文字
+        <!--v-if-->
+        <!---->
       </div>
-    </div>
-    <div
-      class="t-cell__note"
-    >
-      辅助信息
-    </div>
-    <div
-      class="t-cell__right"
-    >
       <div
-        class="t-cell__right-icon"
-      >
-        <svg
-          class="t-icon t-icon-chevron-right"
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
+        class="t-cell__title"
+      >
+        单行标题
+        <!--v-if-->
+        <div
+          class="t-cell__description"
         >
-          <path
-            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
+          一段很长很长的内容文字
+        </div>
       </div>
-    </div>
-  </div>
-  <div
-    class="t-cell t-cell--middle"
-  >
-    <div
-      class="t-cell__left"
-    >
       <div
-        class="t-cell__left-icon"
+        class="t-cell__note"
       >
-        
-        <svg
-          class="t-icon t-icon-lock-on"
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
-        >
-          <path
-            d="M6 10v1h4v-1H6z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-          <path
-            d="M4.5 5v1H3a.5.5 0 00-.5.5v7c0 .28.22.5.5.5h10a.5.5 0 00.5-.5v-7A.5.5 0 0013 6h-1.5V5a3.5 3.5 0 00-7 0zm6 1h-5V5a2.5 2.5 0 015 0v1zm-7 1h9v6h-9V7z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
-        
+        辅助信息
       </div>
-      <!---->
-    </div>
-    <div
-      class="t-cell__title"
-    >
-      单行标题
-      <!--v-if-->
       <div
-        class="t-cell__description"
+        class="t-cell__right"
       >
-        一段很长很长的内容文字
+        <div
+          class="t-cell__right-icon"
+        >
+          <svg
+            class="t-icon t-icon-chevron-right"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </div>
       </div>
     </div>
-    <!--v-if-->
     <div
-      class="t-cell__right"
+      class="t-cell t-cell--middle"
     >
       <div
-        class="t-cell__right-icon"
-      >
-        <svg
-          class="t-icon t-icon-chevron-right"
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
+        class="t-cell__left"
+      >
+        <div
+          class="t-cell__left-icon"
         >
-          <path
-            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
+          
+          <svg
+            class="t-icon t-icon-lock-on"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M6 10v1h4v-1H6z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+            <path
+              d="M4.5 5v1H3a.5.5 0 00-.5.5v7c0 .28.22.5.5.5h10a.5.5 0 00.5-.5v-7A.5.5 0 0013 6h-1.5V5a3.5 3.5 0 00-7 0zm6 1h-5V5a2.5 2.5 0 015 0v1zm-7 1h9v6h-9V7z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+          
+        </div>
+        <!---->
+      </div>
+      <div
+        class="t-cell__title"
+      >
+        单行标题
+        <!--v-if-->
+        <div
+          class="t-cell__description"
+        >
+          一段很长很长的内容文字
+        </div>
       </div>
-    </div>
-  </div>
-  <div
-    class="t-cell t-cell--middle"
-  >
-    <div
-      class="t-cell__left"
-    >
-      <!--v-if-->
-      <!---->
-    </div>
-    <div
-      class="t-cell__title"
-    >
-      单行标题
       <!--v-if-->
       <div
-        class="t-cell__description"
+        class="t-cell__right"
       >
-        一段很长很长的内容文字，长文本自动换行，该选项的描述是一段很长的内容
+        <div
+          class="t-cell__right-icon"
+        >
+          <svg
+            class="t-icon t-icon-chevron-right"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </div>
       </div>
     </div>
-    <!--v-if-->
-    <!--v-if-->
-  </div>
-  <div
-    class="t-cell t-cell--middle"
-  >
     <div
-      class="t-cell__left"
+      class="t-cell t-cell--middle"
     >
+      <div
+        class="t-cell__left"
+      >
+        <!--v-if-->
+        <!---->
+      </div>
+      <div
+        class="t-cell__title"
+      >
+        单行标题
+        <!--v-if-->
+        <div
+          class="t-cell__description"
+        >
+          一段很长很长的内容文字，长文本自动换行，该选项的描述是一段很长的内容
+        </div>
+      </div>
+      <!--v-if-->
       <!--v-if-->
-      <!---->
     </div>
     <div
-      class="t-cell__title"
+      class="t-cell t-cell--middle"
     >
-      多行高度不定，长文本自动换行，该选项的描述是一段很长的内容
-      <!--v-if-->
       <div
-        class="t-cell__description"
+        class="t-cell__left"
       >
-        一段很长很长的内容文字，长文本自动换行，该选项的描述是一段很长的内容
+        <!--v-if-->
+        <!---->
       </div>
+      <div
+        class="t-cell__title"
+      >
+        多行高度不定，长文本自动换行，该选项的描述是一段很长的内容
+        <!--v-if-->
+        <div
+          class="t-cell__description"
+        >
+          一段很长很长的内容文字，长文本自动换行，该选项的描述是一段很长的内容
+        </div>
+      </div>
+      <!--v-if-->
+      <!--v-if-->
     </div>
-    <!--v-if-->
-    <!--v-if-->
-  </div>
-  <div
-    class="t-cell t-cell--middle"
-  >
     <div
-      class="t-cell__left"
+      class="t-cell t-cell--middle"
     >
       <div
-        class="t-cell__left-icon"
+        class="t-cell__left"
       >
-        
         <div
-          class="t-avatar__wrapper"
+          class="t-cell__left-icon"
         >
+          
           <div
-            class="t-avatar__badge"
+            class="t-avatar__wrapper"
           >
             <div
-              class="t-badge"
+              class="t-avatar__badge"
             >
               <div
-                class="t-badge__content"
+                class="t-badge"
               >
-                
                 <div
-                  class="t-avatar t-avatar--medium t-avatar--circle"
+                  class="t-badge__content"
                 >
+                  
                   <div
-                    class="t-image t-image--square"
+                    class="t-avatar t-avatar--medium t-avatar--circle"
                   >
                     <div
-                      class="t-image__mask"
+                      class="t-image t-image--square"
                     >
                       <div
-                        class="t-loading"
-                        style="font-size: 20px;"
+                        class="t-image__mask"
                       >
                         <div
-                          class="t-loading__dots"
-                          style="animation-duration: 800ms; width: 20px; height: 20px;"
+                          class="t-loading"
+                          style="font-size: 20px;"
                         >
-                          
                           <div
-                            class="t-loading__dot"
-                            style="animation-duration: 0.8s; animation-delay: 0s;"
-                          />
-                          <div
-                            class="t-loading__dot"
-                            style="animation-duration: 0.8s; animation-delay: 0.26666666666666666s;"
-                          />
-                          <div
-                            class="t-loading__dot"
-                            style="animation-duration: 0.8s; animation-delay: 0.5333333333333333s;"
-                          />
-                          
+                            class="t-loading__dots"
+                            style="animation-duration: 800ms; width: 20px; height: 20px;"
+                          >
+                            
+                            <div
+                              class="t-loading__dot"
+                              style="animation-duration: 0.8s; animation-delay: 0s;"
+                            />
+                            <div
+                              class="t-loading__dot"
+                              style="animation-duration: 0.8s; animation-delay: 0.26666666666666666s;"
+                            />
+                            <div
+                              class="t-loading__dot"
+                              style="animation-duration: 0.8s; animation-delay: 0.5333333333333333s;"
+                            />
+                            
+                          </div>
+                          <!--v-if-->
+                          <!---->
                         </div>
-                        <!--v-if-->
-                        <!---->
                       </div>
+                      <picture>
+                        <!--v-if-->
+                        <img
+                          alt=""
+                          class="t-image__img"
+                          src="https://tdesign.gtimg.com/mobile/demos/avatar_1.png"
+                          style="object-fit: fill; object-position: center;"
+                        />
+                      </picture>
                     </div>
-                    <picture>
-                      <!--v-if-->
-                      <img
-                        alt=""
-                        class="t-image__img"
-                        src="https://tdesign.gtimg.com/mobile/demos/avatar_1.png"
-                        style="object-fit: fill; object-position: center;"
-                      />
-                    </picture>
                   </div>
+                  
                 </div>
-                
+                <!--v-if-->
+                <!---->
               </div>
-              <!--v-if-->
-              <!---->
             </div>
           </div>
+          
         </div>
-        
+        <!---->
       </div>
-      <!---->
-    </div>
-    <div
-      class="t-cell__title"
-    >
-      多行带头像
-      <!--v-if-->
       <div
-        class="t-cell__description"
+        class="t-cell__title"
       >
-        一段很长很长的内容文字
+        多行带头像
+        <!--v-if-->
+        <div
+          class="t-cell__description"
+        >
+          一段很长很长的内容文字
+        </div>
       </div>
-    </div>
-    <!--v-if-->
-    <div
-      class="t-cell__right"
-    >
+      <!--v-if-->
       <div
-        class="t-cell__right-icon"
-      >
-        <svg
-          class="t-icon t-icon-chevron-right"
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
+        class="t-cell__right"
+      >
+        <div
+          class="t-cell__right-icon"
         >
-          <path
-            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
+          <svg
+            class="t-icon t-icon-chevron-right"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </div>
       </div>
     </div>
-  </div>
-  <div
-    class="t-cell t-cell--middle"
-  >
-    <div
-      class="t-cell__left"
-    >
-      <!--v-if-->
-      <img
-        class="t-cell__left-image"
-        src="https://tdesign.gtimg.com/miniprogram/images/example1.png"
-      />
-    </div>
     <div
-      class="t-cell__title"
+      class="t-cell t-cell--middle"
     >
-      多行带图片
-      <!--v-if-->
       <div
-        class="t-cell__description"
+        class="t-cell__left"
+      >
+        <!--v-if-->
+        <img
+          class="t-cell__left-image"
+          src="https://tdesign.gtimg.com/miniprogram/images/example1.png"
+        />
+      </div>
+      <div
+        class="t-cell__title"
       >
-        一段很长很长的内容文字
+        多行带图片
+        <!--v-if-->
+        <div
+          class="t-cell__description"
+        >
+          一段很长很长的内容文字
+        </div>
       </div>
+      <!--v-if-->
+      <!--v-if-->
     </div>
-    <!--v-if-->
-    <!--v-if-->
+    
   </div>
   
 </div>
@@ -1755,293 +1770,299 @@ exports[`Cell > Cell multipleVue demo works fine 1`] = `
 
 exports[`Cell > Cell singleVue demo works fine 1`] = `
 <div
-  class="t-cell-group t-cell-group--default"
+  data-v-app=""
 >
-  <!--v-if-->
   
+  <!--v-if-->
   <div
-    class="t-cell t-cell--middle"
+    class="t-cell-group t-cell-group--default t-cell-group--bordered"
   >
+    
     <div
-      class="t-cell__left"
+      class="t-cell t-cell--middle"
     >
+      <div
+        class="t-cell__left"
+      >
+        <!--v-if-->
+        <!---->
+      </div>
+      <div
+        class="t-cell__title"
+      >
+        单行标题
+        <!--v-if-->
+        <!--v-if-->
+      </div>
       <!--v-if-->
-      <!---->
-    </div>
-    <div
-      class="t-cell__title"
-    >
-      单行标题
-      <!--v-if-->
-      <!--v-if-->
-    </div>
-    <!--v-if-->
-    <div
-      class="t-cell__right"
-    >
       <div
-        class="t-cell__right-icon"
-      >
-        <svg
-          class="t-icon t-icon-chevron-right"
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
+        class="t-cell__right"
+      >
+        <div
+          class="t-cell__right-icon"
         >
-          <path
-            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
+          <svg
+            class="t-icon t-icon-chevron-right"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </div>
       </div>
     </div>
-  </div>
-  <div
-    class="t-cell t-cell--middle"
-  >
-    <div
-      class="t-cell__left"
-    >
-      <!--v-if-->
-      <!---->
-    </div>
     <div
-      class="t-cell__title"
+      class="t-cell t-cell--middle"
     >
-      单行标题
-      <span
-        class="t-cell--required"
+      <div
+        class="t-cell__left"
       >
-         *
-      </span>
-      <!--v-if-->
-    </div>
-    <!--v-if-->
-    <div
-      class="t-cell__right"
-    >
+        <!--v-if-->
+        <!---->
+      </div>
       <div
-        class="t-cell__right-icon"
-      >
-        <svg
-          class="t-icon t-icon-chevron-right"
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
+        class="t-cell__title"
+      >
+        单行标题
+        <span
+          class="t-cell--required"
         >
-          <path
-            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
+           *
+        </span>
+        <!--v-if-->
       </div>
-    </div>
-  </div>
-  <div
-    class="t-cell t-cell--middle"
-  >
-    <div
-      class="t-cell__left"
-    >
-      <!--v-if-->
-      <!---->
-    </div>
-    <div
-      class="t-cell__title"
-    >
-      单行标题
-      <!--v-if-->
       <!--v-if-->
+      <div
+        class="t-cell__right"
+      >
+        <div
+          class="t-cell__right-icon"
+        >
+          <svg
+            class="t-icon t-icon-chevron-right"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </div>
+      </div>
     </div>
     <div
-      class="t-cell__note"
+      class="t-cell t-cell--middle"
     >
-      
       <div
-        class="t-badge"
+        class="t-cell__left"
+      >
+        <!--v-if-->
+        <!---->
+      </div>
+      <div
+        class="t-cell__title"
       >
+        单行标题
+        <!--v-if-->
+        <!--v-if-->
+      </div>
+      <div
+        class="t-cell__note"
+      >
+        
         <div
-          class="t-badge__content"
+          class="t-badge"
         >
+          <div
+            class="t-badge__content"
+          >
+            <!---->
+          </div>
+          <div
+            class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count"
+          >
+            <!--v-if-->
+             16 
+            <!--v-if-->
+          </div>
           <!---->
         </div>
+        
+      </div>
+      <div
+        class="t-cell__right"
+      >
         <div
-          class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count"
+          class="t-cell__right-icon"
         >
-          <!--v-if-->
-           16 
-          <!--v-if-->
+          <svg
+            class="t-icon t-icon-chevron-right"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
         </div>
-        <!---->
       </div>
-      
     </div>
     <div
-      class="t-cell__right"
+      class="t-cell t-cell--middle"
     >
       <div
-        class="t-cell__right-icon"
-      >
-        <svg
-          class="t-icon t-icon-chevron-right"
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
-        >
-          <path
-            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
+        class="t-cell__left"
+      >
+        <!--v-if-->
+        <!---->
       </div>
-    </div>
-  </div>
-  <div
-    class="t-cell t-cell--middle"
-  >
-    <div
-      class="t-cell__left"
-    >
-      <!--v-if-->
-      <!---->
-    </div>
-    <div
-      class="t-cell__title"
-    >
-      单行标题
-      <!--v-if-->
-      <!--v-if-->
-    </div>
-    <div
-      class="t-cell__note"
-    >
-      
       <div
-        class="t-switch t-switch--medium t-switch--checked"
+        class="t-cell__title"
       >
+        单行标题
+        <!--v-if-->
+        <!--v-if-->
+      </div>
+      <div
+        class="t-cell__note"
+      >
+        
         <div
-          class="t-switch__dot t-switch__dot--medium t-switch__dot--checked t-switch__dot--plain"
+          class="t-switch t-switch--medium t-switch--checked"
         >
           <div
-            class="t-switch__label t-switch__label--medium t-switch__label--checked"
+            class="t-switch__dot t-switch__dot--medium t-switch__dot--checked t-switch__dot--plain"
           >
-            <!--v-if-->
-            <!---->
+            <div
+              class="t-switch__label t-switch__label--medium t-switch__label--checked"
+            >
+              <!--v-if-->
+              <!---->
+            </div>
           </div>
         </div>
+        
       </div>
-      
-    </div>
-    <!--v-if-->
-  </div>
-  <div
-    class="t-cell t-cell--middle"
-  >
-    <div
-      class="t-cell__left"
-    >
-      <!--v-if-->
-      <!---->
-    </div>
-    <div
-      class="t-cell__title"
-    >
-      单行标题
       <!--v-if-->
-      <!--v-if-->
-    </div>
-    <div
-      class="t-cell__note"
-    >
-      辅助信息
     </div>
     <div
-      class="t-cell__right"
+      class="t-cell t-cell--middle"
     >
       <div
-        class="t-cell__right-icon"
-      >
-        <svg
-          class="t-icon t-icon-chevron-right"
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
+        class="t-cell__left"
+      >
+        <!--v-if-->
+        <!---->
+      </div>
+      <div
+        class="t-cell__title"
+      >
+        单行标题
+        <!--v-if-->
+        <!--v-if-->
+      </div>
+      <div
+        class="t-cell__note"
+      >
+        辅助信息
+      </div>
+      <div
+        class="t-cell__right"
+      >
+        <div
+          class="t-cell__right-icon"
         >
-          <path
-            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
+          <svg
+            class="t-icon t-icon-chevron-right"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </div>
       </div>
     </div>
-  </div>
-  <div
-    class="t-cell t-cell--middle"
-  >
     <div
-      class="t-cell__left"
+      class="t-cell t-cell--middle"
     >
       <div
-        class="t-cell__left-icon"
-      >
-        <svg
-          class="t-icon t-icon-lock-on"
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
+        class="t-cell__left"
+      >
+        <div
+          class="t-cell__left-icon"
         >
-          <path
-            d="M6 10v1h4v-1H6z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-          <path
-            d="M4.5 5v1H3a.5.5 0 00-.5.5v7c0 .28.22.5.5.5h10a.5.5 0 00.5-.5v-7A.5.5 0 0013 6h-1.5V5a3.5 3.5 0 00-7 0zm6 1h-5V5a2.5 2.5 0 015 0v1zm-7 1h9v6h-9V7z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
+          <svg
+            class="t-icon t-icon-lock-on"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M6 10v1h4v-1H6z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+            <path
+              d="M4.5 5v1H3a.5.5 0 00-.5.5v7c0 .28.22.5.5.5h10a.5.5 0 00.5-.5v-7A.5.5 0 0013 6h-1.5V5a3.5 3.5 0 00-7 0zm6 1h-5V5a2.5 2.5 0 015 0v1zm-7 1h9v6h-9V7z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </div>
+        <!---->
+      </div>
+      <div
+        class="t-cell__title"
+      >
+        单行标题
+        <!--v-if-->
+        <!--v-if-->
       </div>
-      <!---->
-    </div>
-    <div
-      class="t-cell__title"
-    >
-      单行标题
-      <!--v-if-->
       <!--v-if-->
-    </div>
-    <!--v-if-->
-    <div
-      class="t-cell__right"
-    >
       <div
-        class="t-cell__right-icon"
-      >
-        <svg
-          class="t-icon t-icon-chevron-right"
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
+        class="t-cell__right"
+      >
+        <div
+          class="t-cell__right-icon"
         >
-          <path
-            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
+          <svg
+            class="t-icon t-icon-chevron-right"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </div>
       </div>
     </div>
+    
   </div>
   
 </div>
diff --git a/src/cell/cell-group-props.ts b/src/cell/cell-group-props.ts
index d20c1a8b8..dbad6f27c 100644
--- a/src/cell/cell-group-props.ts
+++ b/src/cell/cell-group-props.ts
@@ -9,7 +9,10 @@ import { PropType } from 'vue';
 
 export default {
   /** 是否显示组边框 */
-  bordered: Boolean,
+  bordered: {
+    type: Boolean,
+    default: false,
+  },
   /** 单元格组风格 */
   theme: {
     type: String as PropType<TdCellGroupProps['theme']>,
diff --git a/src/cell/cell-group.vue b/src/cell/cell-group.vue
index 81064b882..42676a9f7 100644
--- a/src/cell/cell-group.vue
+++ b/src/cell/cell-group.vue
@@ -1,15 +1,15 @@
 <template>
-  <div :class="rootClass">
-    <div v-if="title" :class="`${name}__title`">
-      <slot name="title">{{ title }}</slot>
-    </div>
-
+  <div v-if="titleContent" :class="`${name}__title`">
+    <t-node :content="titleContent" />
+  </div>
+  <div :class="contentClass">
     <slot />
   </div>
 </template>
 
 <script lang="ts">
-import { defineProps, computed } from 'vue';
+import { defineProps, computed, getCurrentInstance } from 'vue';
+import { renderTNode, TNode } from '../shared';
 import CellGroupProps from './cell-group-props';
 import config from '../config';
 
@@ -18,10 +18,13 @@ const name = `${prefix}-cell-group`;
 
 export default {
   name,
+  components: { TNode },
 };
 </script>
 
 <script lang="ts" setup>
 const props = defineProps(CellGroupProps);
-const rootClass = computed(() => [name, `${name}--${props.theme}`]);
+const internalInstance = getCurrentInstance();
+const titleContent = computed(() => renderTNode(internalInstance, 'title'));
+const contentClass = computed(() => [name, `${name}--${props.theme}`, { [`${name}--bordered`]: props.bordered }]);
 </script>
diff --git a/src/cell/cell.en-US.md b/src/cell/cell.en-US.md
index ef91b8aa9..0ebf9d75a 100644
--- a/src/cell/cell.en-US.md
+++ b/src/cell/cell.en-US.md
@@ -28,7 +28,7 @@ click | `(context: { e: MouseEvent })` | Typescript：`string \| TNode`。[see m
 
 name | type | default | description | required
 -- | -- | -- | -- | --
-bordered | Boolean | - | \- | N
+bordered | Boolean | false | \- | N
 theme | String | default | `0.15.0`。options：default/card | N
 title | String | - | \- | N
 
diff --git a/src/cell/cell.md b/src/cell/cell.md
index abaaaeb89..5ab678eca 100644
--- a/src/cell/cell.md
+++ b/src/cell/cell.md
@@ -28,7 +28,7 @@ click | `(context: { e: MouseEvent })` | 右侧内容。TS 类型：`string \| T
 
 名称 | 类型 | 默认值 | 说明 | 必传
 -- | -- | -- | -- | --
-bordered | Boolean | - | 是否显示组边框 | N
+bordered | Boolean | false | 是否显示组边框 | N
 theme | String | default | `0.15.0`。单元格组风格。可选项：default/card | N
 title | String | - | 单元格组标题 | N
 
diff --git a/src/cell/type.ts b/src/cell/type.ts
index 4e4edf1aa..334a60464 100644
--- a/src/cell/type.ts
+++ b/src/cell/type.ts
@@ -64,6 +64,7 @@ export interface TdCellProps {
 export interface TdCellGroupProps {
   /**
    * 是否显示组边框
+   * @default false
    */
   bordered?: boolean;
   /**
diff --git a/src/indexes/__test__/__snapshots__/demo.test.jsx.snap b/src/indexes/__test__/__snapshots__/demo.test.jsx.snap
index f596333cd..a23d9ced2 100644
--- a/src/indexes/__test__/__snapshots__/demo.test.jsx.snap
+++ b/src/indexes/__test__/__snapshots__/demo.test.jsx.snap
@@ -99,10 +99,11 @@ exports[`Indexes > Indexes baseVue demo works fine 1`] = `
         </div>
       </div>
     </div>
+    
+    <!--v-if-->
     <div
       class="t-cell-group t-cell-group--default"
     >
-      <!--v-if-->
       
       
       <div
@@ -281,6 +282,7 @@ exports[`Indexes > Indexes baseVue demo works fine 1`] = `
     </div>
     
     
+    
     <div
       class="t-indexes-anchor"
       data-index="B"
@@ -301,10 +303,11 @@ exports[`Indexes > Indexes baseVue demo works fine 1`] = `
         </div>
       </div>
     </div>
+    
+    <!--v-if-->
     <div
       class="t-cell-group t-cell-group--default"
     >
-      <!--v-if-->
       
       
       <div
@@ -578,6 +581,7 @@ exports[`Indexes > Indexes baseVue demo works fine 1`] = `
     </div>
     
     
+    
     <div
       class="t-indexes-anchor"
       data-index="C"
@@ -598,10 +602,11 @@ exports[`Indexes > Indexes baseVue demo works fine 1`] = `
         </div>
       </div>
     </div>
+    
+    <!--v-if-->
     <div
       class="t-cell-group t-cell-group--default"
     >
-      <!--v-if-->
       
       
       <div
@@ -970,6 +975,7 @@ exports[`Indexes > Indexes baseVue demo works fine 1`] = `
     </div>
     
     
+    
     <div
       class="t-indexes-anchor"
       data-index="D"
@@ -990,10 +996,11 @@ exports[`Indexes > Indexes baseVue demo works fine 1`] = `
         </div>
       </div>
     </div>
+    
+    <!--v-if-->
     <div
       class="t-cell-group t-cell-group--default"
     >
-      <!--v-if-->
       
       
       <div
@@ -1248,6 +1255,7 @@ exports[`Indexes > Indexes baseVue demo works fine 1`] = `
     </div>
     
     
+    
     <div
       class="t-indexes-anchor"
       data-index="E"
@@ -1268,10 +1276,11 @@ exports[`Indexes > Indexes baseVue demo works fine 1`] = `
         </div>
       </div>
     </div>
+    
+    <!--v-if-->
     <div
       class="t-cell-group t-cell-group--default"
     >
-      <!--v-if-->
       
       
       <div
@@ -1336,6 +1345,7 @@ exports[`Indexes > Indexes baseVue demo works fine 1`] = `
     </div>
     
     
+    
     <div
       class="t-indexes-anchor"
       data-index="F"
@@ -1356,10 +1366,11 @@ exports[`Indexes > Indexes baseVue demo works fine 1`] = `
         </div>
       </div>
     </div>
+    
+    <!--v-if-->
     <div
       class="t-cell-group t-cell-group--default"
     >
-      <!--v-if-->
       
       
       <div
@@ -1500,6 +1511,7 @@ exports[`Indexes > Indexes baseVue demo works fine 1`] = `
     </div>
     
     
+    
     <div
       class="t-indexes-anchor"
       data-index="G"
@@ -1520,10 +1532,11 @@ exports[`Indexes > Indexes baseVue demo works fine 1`] = `
         </div>
       </div>
     </div>
+    
+    <!--v-if-->
     <div
       class="t-cell-group t-cell-group--default"
     >
-      <!--v-if-->
       
       
       <div
@@ -1721,6 +1734,7 @@ exports[`Indexes > Indexes baseVue demo works fine 1`] = `
     </div>
     
     
+    
     <div
       class="t-indexes-anchor"
       data-index="J"
@@ -1741,10 +1755,11 @@ exports[`Indexes > Indexes baseVue demo works fine 1`] = `
         </div>
       </div>
     </div>
+    
+    <!--v-if-->
     <div
       class="t-cell-group t-cell-group--default"
     >
-      <!--v-if-->
       
       
       <div
@@ -1961,6 +1976,7 @@ exports[`Indexes > Indexes baseVue demo works fine 1`] = `
     </div>
     
     
+    
     <div
       class="t-indexes-anchor"
       data-index="K"
@@ -1981,10 +1997,11 @@ exports[`Indexes > Indexes baseVue demo works fine 1`] = `
         </div>
       </div>
     </div>
+    
+    <!--v-if-->
     <div
       class="t-cell-group t-cell-group--default"
     >
-      <!--v-if-->
       
       
       <div
@@ -2069,6 +2086,7 @@ exports[`Indexes > Indexes baseVue demo works fine 1`] = `
     
     
     
+    
   </div>
 </div>
 `;
@@ -2163,10 +2181,11 @@ exports[`Indexes > Indexes customVue demo works fine 1`] = `
         </div>
       </div>
     </div>
+    
+    <!--v-if-->
     <div
       class="t-cell-group t-cell-group--default"
     >
-      <!--v-if-->
       
       
       <div
@@ -2269,6 +2288,7 @@ exports[`Indexes > Indexes customVue demo works fine 1`] = `
     </div>
     
     
+    
     <div
       class="t-indexes-anchor"
       data-index="3"
@@ -2294,10 +2314,11 @@ exports[`Indexes > Indexes customVue demo works fine 1`] = `
         </div>
       </div>
     </div>
+    
+    <!--v-if-->
     <div
       class="t-cell-group t-cell-group--default"
     >
-      <!--v-if-->
       
       
       <div
@@ -2400,6 +2421,7 @@ exports[`Indexes > Indexes customVue demo works fine 1`] = `
     </div>
     
     
+    
     <div
       class="t-indexes-anchor"
       data-index="5"
@@ -2425,10 +2447,11 @@ exports[`Indexes > Indexes customVue demo works fine 1`] = `
         </div>
       </div>
     </div>
+    
+    <!--v-if-->
     <div
       class="t-cell-group t-cell-group--default"
     >
-      <!--v-if-->
       
       
       <div
@@ -2531,6 +2554,7 @@ exports[`Indexes > Indexes customVue demo works fine 1`] = `
     </div>
     
     
+    
     <div
       class="t-indexes-anchor"
       data-index="7"
@@ -2556,10 +2580,11 @@ exports[`Indexes > Indexes customVue demo works fine 1`] = `
         </div>
       </div>
     </div>
+    
+    <!--v-if-->
     <div
       class="t-cell-group t-cell-group--default"
     >
-      <!--v-if-->
       
       
       <div
@@ -2662,6 +2687,7 @@ exports[`Indexes > Indexes customVue demo works fine 1`] = `
     </div>
     
     
+    
     <div
       class="t-indexes-anchor"
       data-index="8"
@@ -2687,10 +2713,11 @@ exports[`Indexes > Indexes customVue demo works fine 1`] = `
         </div>
       </div>
     </div>
+    
+    <!--v-if-->
     <div
       class="t-cell-group t-cell-group--default"
     >
-      <!--v-if-->
       
       
       <div
@@ -2793,6 +2820,7 @@ exports[`Indexes > Indexes customVue demo works fine 1`] = `
     </div>
     
     
+    
     <div
       class="t-indexes-anchor"
       data-index="10"
@@ -2818,10 +2846,11 @@ exports[`Indexes > Indexes customVue demo works fine 1`] = `
         </div>
       </div>
     </div>
+    
+    <!--v-if-->
     <div
       class="t-cell-group t-cell-group--default"
     >
-      <!--v-if-->
       
       
       <div
@@ -2924,6 +2953,7 @@ exports[`Indexes > Indexes customVue demo works fine 1`] = `
     </div>
     
     
+    
     <div
       class="t-indexes-anchor"
       data-index="#"
@@ -2949,10 +2979,11 @@ exports[`Indexes > Indexes customVue demo works fine 1`] = `
         </div>
       </div>
     </div>
+    
+    <!--v-if-->
     <div
       class="t-cell-group t-cell-group--default"
     >
-      <!--v-if-->
       
       
       <div
@@ -3056,6 +3087,7 @@ exports[`Indexes > Indexes customVue demo works fine 1`] = `
     
     
     
+    
   </div>
 </div>
 `;
diff --git a/src/picker/__test__/__snapshots__/demo.test.jsx.snap b/src/picker/__test__/__snapshots__/demo.test.jsx.snap
index 59fe67d11..9f01330ba 100644
--- a/src/picker/__test__/__snapshots__/demo.test.jsx.snap
+++ b/src/picker/__test__/__snapshots__/demo.test.jsx.snap
@@ -499,10 +499,11 @@ exports[`Picker > Picker cascadeVue demo works fine 1`] = `
 >
   
   <!-- 联动选择 -->
+  
+  <!--v-if-->
   <div
     class="t-cell-group t-cell-group--default"
   >
-    <!--v-if-->
     
     <div
       class="t-cell t-cell--middle"
@@ -549,6 +550,7 @@ exports[`Picker > Picker cascadeVue demo works fine 1`] = `
     </div>
     
   </div>
+  
   <teleport-stub
     disabled="false"
     to="[object HTMLBodyElement]"