chore: migrate cell default slot (#8971)

src/address-list/AddressListItem.tsx

@@ -96,7 +96,7 @@ export default defineComponent({
         <div class={bem({ disabled })} onClick={onClick}>
           <Cell
             v-slots={{
-              default: renderContent,
+              value: renderContent,
               'right-icon': renderRightIcon,
             }}
             border={false}

src/contact-card/ContactCard.tsx

@@ -42,6 +42,7 @@ export default defineComponent({
 
     return () => (
       <Cell
+        v-slots={{ value: renderContent }}
         center
         icon={props.type === 'edit' ? 'contact' : 'add-square'}
         class={bem([props.type])}
@@ -49,9 +50,7 @@ export default defineComponent({
         isLink={props.editable}
         valueClass={bem('value')}
         onClick={onClick}
-      >
+      />
-        {renderContent()}
-      </Cell>
     );
   },
 });

src/contact-list/ContactList.tsx

@@ -72,7 +72,7 @@ export default defineComponent({
         <Cell
           v-slots={{
             icon: renderEditIcon,
-            default: renderContent,
+            value: renderContent,
             'right-icon': renderRightIcon,
           }}
           key={item.id}

src/dropdown-item/DropdownItem.tsx

@@ -134,8 +134,17 @@ export default defineComponent({
         }
       };
 
+      const renderIcon = () => {
+        if (active) {
+          return (
+            <Icon class={bem('icon')} color={activeColor} name="success" />
+          );
+        }
+      };
+
       return (
         <Cell
+          v-slots={{ value: renderIcon }}
           clickable
           key={option.value}
           icon={option.icon}
@@ -143,11 +152,7 @@ export default defineComponent({
           class={bem('option', { active })}
           style={{ color: active ? activeColor : '' }}
           onClick={onClick}
-        >
+        ></Cell>
-          {active && (
-            <Icon class={bem('icon')} color={activeColor} name="success" />
-          )}
-        </Cell>
       );
     };
 

src/field/Field.tsx

@@ -486,6 +486,23 @@ export default defineComponent({
       }
     };
 
+    const renderFieldBody = () => [
+      <div class={bem('body')}>
+        {renderInput()}
+        {showClear.value && (
+          <Icon
+            name={props.clearIcon}
+            class={bem('clear')}
+            onTouchstart={onClear}
+          />
+        )}
+        {renderRightIcon()}
+        {slots.button && <div class={bem('button')}>{slots.button()}</div>}
+      </div>,
+      renderWordLimit(),
+      renderMessage(),
+    ];
+
     useExpose({
       blur,
       focus,
@@ -526,6 +543,7 @@ export default defineComponent({
           v-slots={{
             icon: LeftIcon ? () => LeftIcon : null,
             title: Label ? () => Label : null,
+            value: renderFieldBody,
             extra: slots.extra,
           }}
           size={props.size}
@@ -545,22 +563,7 @@ export default defineComponent({
           valueClass={bem('value')}
           titleClass={[bem('label', labelAlign), props.labelClass]}
           arrowDirection={props.arrowDirection}
-        >
+        />
-          <div class={bem('body')}>
-            {renderInput()}
-            {showClear.value && (
-              <Icon
-                name={props.clearIcon}
-                class={bem('clear')}
-                onTouchstart={onClear}
-              />
-            )}
-            {renderRightIcon()}
-            {slots.button && <div class={bem('button')}>{slots.button()}</div>}
-          </div>
-          {renderWordLimit()}
-          {renderMessage()}
-        </Cell>
       );
     };
   },