From b8e73f6c58d57501c3797925b753eea30b7233a0 Mon Sep 17 00:00:00 2001
From: hanyuxinting <hanyuxinting@sina.cn>
Date: Wed, 19 Feb 2025 15:34:46 +0800
Subject: [PATCH 1/4] =?UTF-8?q?perf:=20=E5=88=A0=E9=99=A4=E6=97=A0?=
 =?UTF-8?q?=E6=84=8F=E4=B9=89=E7=9A=84=E8=B0=83=E7=94=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/config.json                               |  2 +-
 src/packages/actionsheet/demos/taro/demo1.tsx |  5 +-
 src/packages/actionsheet/demos/taro/demo2.tsx |  5 +-
 src/packages/actionsheet/demos/taro/demo3.tsx |  5 +-
 src/packages/actionsheet/demos/taro/demo5.tsx |  5 +-
 src/packages/avatar/demos/taro/demo9.tsx      |  7 +--
 src/packages/card/demos/taro/demo2.tsx        |  2 +-
 src/packages/card/demos/taro/demo3.tsx        |  9 ++-
 src/packages/card/demos/taro/demo5.tsx        |  3 +-
 src/packages/card/demos/taro/demo6.tsx        |  2 +-
 src/packages/cell/demos/taro/demo3.tsx        | 11 ++--
 src/packages/cell/demos/taro/demo6.tsx        | 17 +++---
 .../configprovider/demos/taro/demo5.tsx       |  7 +--
 src/packages/countdown/demos/taro/demo8.tsx   | 13 ++--
 src/packages/divider/demos/taro/demo5.tsx     |  5 +-
 src/packages/icon/demo.taro.tsx               |  1 -
 src/packages/icon/demos/taro/demo1.tsx        |  7 ++-
 src/packages/icon/demos/taro/demo2.tsx        |  4 +-
 src/packages/icon/demos/taro/demo4.tsx        |  4 +-
 src/packages/icon/demos/taro/demo5.tsx        |  4 +-
 src/packages/icon/demos/taro/demo6.tsx        |  2 +-
 src/packages/icon/demos/taro/demo7.tsx        |  2 +-
 src/packages/progress/demos/taro/demo6.tsx    | 12 ++--
 src/packages/progress/demos/taro/demo7.tsx    |  5 +-
 src/packages/skeleton/demo.taro.tsx           | 21 ++-----
 src/packages/skeleton/demo.tsx                | 21 ++-----
 src/packages/skeleton/demos/h5/demo1.tsx      |  8 ++-
 src/packages/skeleton/demos/h5/demo2.tsx      |  8 ++-
 src/packages/skeleton/demos/h5/demo3.tsx      |  8 ++-
 src/packages/skeleton/demos/h5/demo4.tsx      | 18 +++---
 src/packages/skeleton/demos/h5/demo5.tsx      | 50 +++++++--------
 src/packages/skeleton/demos/taro/demo1.tsx    |  8 ++-
 src/packages/skeleton/demos/taro/demo2.tsx    |  8 ++-
 src/packages/skeleton/demos/taro/demo3.tsx    |  8 ++-
 src/packages/skeleton/demos/taro/demo4.tsx    | 18 +++---
 src/packages/skeleton/demos/taro/demo5.tsx    | 61 ++++++++++---------
 36 files changed, 185 insertions(+), 191 deletions(-)

diff --git a/src/config.json b/src/config.json
index 05e6d9d277..70976e92f3 100644
--- a/src/config.json
+++ b/src/config.json
@@ -1012,7 +1012,7 @@
           "show": true,
           "taro": true,
           "author": "swag~jun",
-          "dd": false
+          "dd": true
         },
         {
           "version": "3.0.0",
diff --git a/src/packages/actionsheet/demos/taro/demo1.tsx b/src/packages/actionsheet/demos/taro/demo1.tsx
index a886365e03..276a907fe3 100644
--- a/src/packages/actionsheet/demos/taro/demo1.tsx
+++ b/src/packages/actionsheet/demos/taro/demo1.tsx
@@ -1,7 +1,6 @@
 import React, { useState } from 'react'
 import { ActionSheet, Cell } from '@nutui/nutui-react-taro'
 import { View } from '@tarojs/components'
-import pxTransform from '@/utils/px-transform'
 
 const Demo1 = () => {
   const [val, setVal] = useState('')
@@ -27,9 +26,7 @@ const Demo1 = () => {
     <>
       <Cell onClick={() => setIsVisible(!isVisible)}>
         <View>基础用法</View>
-        <View style={{ marginLeft: pxTransform(10), color: '#999' }}>
-          {val}
-        </View>
+        <View style={{ marginLeft: 10, color: '#999' }}>{val}</View>
       </Cell>
       <ActionSheet
         title="标题"
diff --git a/src/packages/actionsheet/demos/taro/demo2.tsx b/src/packages/actionsheet/demos/taro/demo2.tsx
index 9abf1ac1d4..f287a551c3 100644
--- a/src/packages/actionsheet/demos/taro/demo2.tsx
+++ b/src/packages/actionsheet/demos/taro/demo2.tsx
@@ -1,7 +1,6 @@
 import React, { useState } from 'react'
 import { ActionSheet, Cell } from '@nutui/nutui-react-taro'
 import { View } from '@tarojs/components'
-import pxTransform from '@/utils/px-transform'
 
 const Demo2 = () => {
   const [isVisible, setIsVisible] = useState(false)
@@ -25,9 +24,7 @@ const Demo2 = () => {
     <>
       <Cell onClick={() => setIsVisible(!isVisible)}>
         <View>展示取消按钮</View>
-        <View style={{ marginLeft: pxTransform(10), color: '#999' }}>
-          {val}
-        </View>
+        <View style={{ marginLeft: 10, color: '#999' }}>{val}</View>
       </Cell>
       <ActionSheet
         visible={isVisible}
diff --git a/src/packages/actionsheet/demos/taro/demo3.tsx b/src/packages/actionsheet/demos/taro/demo3.tsx
index 8d5ed1d1c4..d7c6e6873a 100644
--- a/src/packages/actionsheet/demos/taro/demo3.tsx
+++ b/src/packages/actionsheet/demos/taro/demo3.tsx
@@ -1,7 +1,6 @@
 import React, { useState } from 'react'
 import { ActionSheet, Cell } from '@nutui/nutui-react-taro'
 import { View } from '@tarojs/components'
-import pxTransform from '@/utils/px-transform'
 
 const Demo3 = () => {
   const [isVisible, setIsVisible] = useState(false)
@@ -26,9 +25,7 @@ const Demo3 = () => {
     <>
       <Cell onClick={() => setIsVisible(!isVisible)}>
         <View>展示描述信息</View>
-        <View style={{ marginLeft: pxTransform(10), color: '#999' }}>
-          {val}
-        </View>
+        <View style={{ marginLeft: 10, color: '#999' }}>{val}</View>
       </Cell>
       <ActionSheet
         visible={isVisible}
diff --git a/src/packages/actionsheet/demos/taro/demo5.tsx b/src/packages/actionsheet/demos/taro/demo5.tsx
index cf39a8f2d4..56837feba4 100644
--- a/src/packages/actionsheet/demos/taro/demo5.tsx
+++ b/src/packages/actionsheet/demos/taro/demo5.tsx
@@ -1,14 +1,13 @@
 import React, { CSSProperties, useState } from 'react'
 import { ActionSheet, Cell } from '@nutui/nutui-react-taro'
 import { View } from '@tarojs/components'
-import pxTransform from '@/utils/px-transform'
 
 const Demo5 = () => {
   const [isVisible, setIsVisible] = useState(false)
   const viewStyle: CSSProperties = {
     textAlign: 'left',
-    paddingLeft: pxTransform(20),
-    paddingTop: pxTransform(10),
+    paddingLeft: 20,
+    paddingTop: 10,
   }
   return (
     <>
diff --git a/src/packages/avatar/demos/taro/demo9.tsx b/src/packages/avatar/demos/taro/demo9.tsx
index 52d109a6a2..b2fda9a200 100644
--- a/src/packages/avatar/demos/taro/demo9.tsx
+++ b/src/packages/avatar/demos/taro/demo9.tsx
@@ -1,18 +1,17 @@
 import React from 'react'
 import { View } from '@tarojs/components'
 import { Avatar, Cell } from '@nutui/nutui-react-taro'
-import pxTransform from '@/utils/px-transform'
 
 const Demo9 = () => {
   return (
     <Cell className="cell-avatar">
       <Avatar
         src="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png"
-        style={{ marginRight: pxTransform(10) }}
+        style={{ marginRight: 10 }}
       />
       <View>
-        <View style={{ fontSize: pxTransform(16) }}>标题</View>
-        <View style={{ fontSize: pxTransform(12) }}>描述信息</View>
+        <View style={{ fontSize: 16 }}>标题</View>
+        <View style={{ fontSize: 12 }}>描述信息</View>
       </View>
     </Cell>
   )
diff --git a/src/packages/card/demos/taro/demo2.tsx b/src/packages/card/demos/taro/demo2.tsx
index 9499fb5903..b92f704d52 100644
--- a/src/packages/card/demos/taro/demo2.tsx
+++ b/src/packages/card/demos/taro/demo2.tsx
@@ -15,7 +15,7 @@ const Demo2 = () => {
     shopName: '阳澄湖大闸蟹自营店>',
   }
   const wordStyles = {
-    marginRight: pxTransform(5),
+    marginRight: 5,
   }
   return (
     <Card
diff --git a/src/packages/card/demos/taro/demo3.tsx b/src/packages/card/demos/taro/demo3.tsx
index fec72569bb..28726ee9c8 100644
--- a/src/packages/card/demos/taro/demo3.tsx
+++ b/src/packages/card/demos/taro/demo3.tsx
@@ -1,6 +1,5 @@
 import React from 'react'
 import { Card, Image } from '@nutui/nutui-react-taro'
-import pxTransform from '@/utils/px-transform'
 
 const Demo3 = () => {
   const state = {
@@ -15,8 +14,8 @@ const Demo3 = () => {
   }
   const tagStyles = {
     display: 'inline-flex',
-    marginRight: pxTransform(5),
-    marginLeft: pxTransform(2),
+    marginRight: 5,
+    marginLeft: 2,
   }
   return (
     <Card
@@ -30,8 +29,8 @@ const Demo3 = () => {
       priceTag={
         <Image
           style={tagStyles}
-          height={pxTransform(14)}
-          width={pxTransform(29)}
+          height={14}
+          width={29}
           src="https://img11.360buyimg.com/jdphoto/s58x28_jfs/t9451/359/415622649/15318/b0943e5d/59a78495N3bd2a9f8.png"
         />
       }
diff --git a/src/packages/card/demos/taro/demo5.tsx b/src/packages/card/demos/taro/demo5.tsx
index 0d334624ab..0ad2ce597a 100644
--- a/src/packages/card/demos/taro/demo5.tsx
+++ b/src/packages/card/demos/taro/demo5.tsx
@@ -1,7 +1,6 @@
 import React from 'react'
 import { View } from '@tarojs/components'
 import { Card } from '@nutui/nutui-react-taro'
-import pxTransform from '@/utils/px-transform'
 
 const Demo5 = () => {
   const state = {
@@ -24,7 +23,7 @@ const Demo5 = () => {
       shopDescription={state.shopDescription}
       delivery={state.delivery}
       shopName={state.shopName}
-      extra={<View style={{ fontSize: pxTransform(12) }}>自定义</View>}
+      extra={<View style={{ fontSize: 12 }}>自定义</View>}
     />
   )
 }
diff --git a/src/packages/card/demos/taro/demo6.tsx b/src/packages/card/demos/taro/demo6.tsx
index 9d49c84533..be0323bc22 100644
--- a/src/packages/card/demos/taro/demo6.tsx
+++ b/src/packages/card/demos/taro/demo6.tsx
@@ -17,7 +17,7 @@ const Demo6 = () => {
       description={
         <View
           style={{
-            fontSize: pxTransform(14),
+            fontSize: 12,
             padding: `${pxTransform(10)} 0`,
             color: '#999',
           }}
diff --git a/src/packages/cell/demos/taro/demo3.tsx b/src/packages/cell/demos/taro/demo3.tsx
index 555929e10a..26bd49ca18 100644
--- a/src/packages/cell/demos/taro/demo3.tsx
+++ b/src/packages/cell/demos/taro/demo3.tsx
@@ -2,7 +2,6 @@ import React from 'react'
 import { Cell } from '@nutui/nutui-react-taro'
 import { View, Text } from '@tarojs/components'
 import { User } from '@nutui/icons-react-taro'
-import pxTransform from '@/utils/px-transform'
 
 const Demo3 = () => {
   return (
@@ -13,11 +12,11 @@ const Demo3 = () => {
             display: 'flex',
             alignItems: 'center',
             flexDirection: 'row',
-            height: pxTransform(20),
+            height: 20,
           }}
         >
           <User size={16} />
-          <View style={{ marginLeft: pxTransform(5) }}>我是标题</View>
+          <View style={{ marginLeft: 5 }}>我是标题</View>
         </View>
       }
       description={
@@ -26,13 +25,13 @@ const Demo3 = () => {
             display: 'flex',
             flexDirection: 'row',
             alignItems: 'center',
-            fontSize: pxTransform(12),
+            fontSize: 12,
             color: '#505259',
-            height: pxTransform(20),
+            height: 20,
           }}
         >
           我是描述
-          <Text style={{ color: 'red', fontSize: pxTransform(12) }}>1</Text>
+          <Text style={{ color: 'red', fontSize: 12 }}>1</Text>
         </View>
       }
       extra="描述文字"
diff --git a/src/packages/cell/demos/taro/demo6.tsx b/src/packages/cell/demos/taro/demo6.tsx
index 55eb305923..c27733b945 100644
--- a/src/packages/cell/demos/taro/demo6.tsx
+++ b/src/packages/cell/demos/taro/demo6.tsx
@@ -3,7 +3,6 @@ import { Button, Cell } from '@nutui/nutui-react-taro'
 import { navigateTo, redirectTo } from '@tarojs/taro'
 import { ArrowRight, User } from '@nutui/icons-react-taro'
 import { ITouchEvent, Text, View } from '@tarojs/components'
-import pxTransform from '@/utils/px-transform'
 
 const Demo6 = () => {
   const onJumpclick = (
@@ -29,9 +28,7 @@ const Demo6 = () => {
           title="URL 跳转"
           extra={
             <>
-              <View style={{ marginRight: pxTransform(5) }}>
-                /pages/index/index
-              </View>
+              <View style={{ marginRight: 5 }}>/pages/index/index</View>
               <ArrowRight />
             </>
           }
@@ -52,12 +49,12 @@ const Demo6 = () => {
                 flexDirection: 'row',
               }}
             >
-              <View style={{ fontWeight: pxTransform(500) }}>我是标题</View>
+              <View style={{ fontWeight: 500 }}>我是标题</View>
               <View
                 style={{
                   color: '#888B94',
-                  fontSize: pxTransform(10),
-                  marginLeft: pxTransform(5),
+                  fontSize: 10,
+                  marginLeft: 5,
                 }}
               >
                 我是描述
@@ -78,7 +75,7 @@ const Demo6 = () => {
           }
         />
         <Cell>
-          <View style={{ minHeight: pxTransform(50) }}>自定义内容</View>
+          <View style={{ minHeight: 50 }}>自定义内容</View>
         </Cell>
         <Cell
           align="center"
@@ -86,7 +83,7 @@ const Demo6 = () => {
             <Text
               style={{
                 color: '#888B94',
-                fontSize: pxTransform(12),
+                fontSize: 12,
               }}
             >
               我是描述
@@ -117,7 +114,7 @@ const Demo6 = () => {
           extra={<ArrowRight />}
         />
         <Cell>
-          <View style={{ minHeight: pxTransform(50) }}>自定义内容</View>
+          <View style={{ minHeight: 50 }}>自定义内容</View>
         </Cell>
         <Cell
           align="center"
diff --git a/src/packages/configprovider/demos/taro/demo5.tsx b/src/packages/configprovider/demos/taro/demo5.tsx
index a9fd054fbd..a1a48b7f53 100644
--- a/src/packages/configprovider/demos/taro/demo5.tsx
+++ b/src/packages/configprovider/demos/taro/demo5.tsx
@@ -1,7 +1,6 @@
 import React from 'react'
 import { View, Text } from '@tarojs/components'
 import { ConfigProvider, Cell } from '@nutui/nutui-react-taro'
-import pxTransform from '@/utils/px-transform'
 
 const Demo5 = () => {
   return (
@@ -10,13 +9,11 @@ const Demo5 = () => {
         <Cell
           title={
             <View>
-              <Text style={{ fontSize: pxTransform(14) }}>我是标题</Text>
+              <Text style={{ fontSize: 14 }}>我是标题</Text>
             </View>
           }
           description={
-            <Text style={{ fontSize: pxTransform(12), color: '#ccc' }}>
-              我是描述
-            </Text>
+            <Text style={{ fontSize: 12, color: '#ccc' }}>我是描述</Text>
           }
           extra="描述文字"
         />
diff --git a/src/packages/countdown/demos/taro/demo8.tsx b/src/packages/countdown/demos/taro/demo8.tsx
index 34bf360b11..4ad0448121 100644
--- a/src/packages/countdown/demos/taro/demo8.tsx
+++ b/src/packages/countdown/demos/taro/demo8.tsx
@@ -1,7 +1,6 @@
 import React, { useRef, useState } from 'react'
 import { Cell, CountDown } from '@nutui/nutui-react-taro'
 import { View } from '@tarojs/components'
-import pxTransform from '@/utils/px-transform'
 
 const partItemStyle = {
   display: 'flex',
@@ -10,15 +9,15 @@ const partItemStyle = {
   backgroundColor: '#fa2c19',
   color: '#fff',
   ...{
-    width: pxTransform(20),
-    height: pxTransform(25),
-    fontSize: pxTransform(14),
-    borderRadius: pxTransform(6),
+    width: 20,
+    height: 25,
+    fontSize: 14,
+    borderRadius: 6,
   },
 }
 const partItemSymbolStyle = {
-  marginLeft: pxTransform(5),
-  marginRight: pxTransform(5),
+  marginLeft: 5,
+  marginRight: 5,
 }
 
 const Demo8 = () => {
diff --git a/src/packages/divider/demos/taro/demo5.tsx b/src/packages/divider/demos/taro/demo5.tsx
index 75cb956edd..aa9de9a56b 100644
--- a/src/packages/divider/demos/taro/demo5.tsx
+++ b/src/packages/divider/demos/taro/demo5.tsx
@@ -1,6 +1,5 @@
 import React from 'react'
 import { Cell, Divider } from '@nutui/nutui-react-taro'
-import pxTransform from '@/utils/px-transform'
 
 const Demo5 = () => {
   return (
@@ -8,8 +7,8 @@ const Demo5 = () => {
       <Divider
         style={{
           color: '#0073ff',
-          paddingLeft: pxTransform(16),
-          paddingRight: pxTransform(16),
+          paddingLeft: 16,
+          paddingRight: 16,
           borderColor: '#0073ff',
           borderStyle: 'dashed',
         }}
diff --git a/src/packages/icon/demo.taro.tsx b/src/packages/icon/demo.taro.tsx
index 84d47967c4..69767e0c91 100644
--- a/src/packages/icon/demo.taro.tsx
+++ b/src/packages/icon/demo.taro.tsx
@@ -1,7 +1,6 @@
 import React, { useState } from 'react'
 import Taro from '@tarojs/taro'
 import { ScrollView, View } from '@tarojs/components'
-// import '@nutui/icons-react-taro/dist/style_iconfont.css'
 import { Toast } from '@nutui/nutui-react-taro'
 import { useTranslate } from '@/sites/assets/locale/taro'
 import Header from '@/sites/components/header'
diff --git a/src/packages/icon/demos/taro/demo1.tsx b/src/packages/icon/demos/taro/demo1.tsx
index 31f192d76a..adcf89dd39 100644
--- a/src/packages/icon/demos/taro/demo1.tsx
+++ b/src/packages/icon/demos/taro/demo1.tsx
@@ -3,11 +3,12 @@ import { Cell } from '@nutui/nutui-react-taro'
 import { Add, Dongdong, UserAdd, Minus } from '@nutui/icons-react-taro'
 
 const Demo1 = () => {
+  console.log('dddd')
   return (
     <Cell>
-      <Add color="red" style={{ marginRight: '10px' }} />
-      <UserAdd style={{ marginRight: '10px' }} />
-      <Dongdong style={{ marginRight: '10px' }} />
+      <Add color="red" style={{ marginRight: 10 }} />
+      <UserAdd style={{ marginRight: 10 }} />
+      <Dongdong style={{ marginRight: 10 }} />
       <Minus />
     </Cell>
   )
diff --git a/src/packages/icon/demos/taro/demo2.tsx b/src/packages/icon/demos/taro/demo2.tsx
index 7644599a78..807429711a 100644
--- a/src/packages/icon/demos/taro/demo2.tsx
+++ b/src/packages/icon/demos/taro/demo2.tsx
@@ -5,8 +5,8 @@ import { IconFont } from '@nutui/icons-react-taro'
 const Demo2 = () => {
   return (
     <Cell>
-      <IconFont name="dongdong" style={{ marginRight: '10px' }} />
-      <IconFont name="add" style={{ marginRight: '10px' }} />
+      <IconFont name="dongdong" style={{ marginRight: 10 }} />
+      <IconFont name="add" style={{ marginRight: 10 }} />
       <IconFont name="minus" />
     </Cell>
   )
diff --git a/src/packages/icon/demos/taro/demo4.tsx b/src/packages/icon/demos/taro/demo4.tsx
index 8be9aec196..e173686957 100644
--- a/src/packages/icon/demos/taro/demo4.tsx
+++ b/src/packages/icon/demos/taro/demo4.tsx
@@ -5,8 +5,8 @@ import { Dongdong } from '@nutui/icons-react-taro'
 const Demo4 = () => {
   return (
     <Cell>
-      <Dongdong color="#FF0F23" style={{ marginRight: '10px' }} />
-      <Dongdong color="#64b578" style={{ marginRight: '10px' }} />
+      <Dongdong color="#FF0F23" style={{ marginRight: 10 }} />
+      <Dongdong color="#64b578" style={{ marginRight: 10 }} />
       <Dongdong color="#ffd700" />
     </Cell>
   )
diff --git a/src/packages/icon/demos/taro/demo5.tsx b/src/packages/icon/demos/taro/demo5.tsx
index f8d98e9cdf..1eec3927f0 100644
--- a/src/packages/icon/demos/taro/demo5.tsx
+++ b/src/packages/icon/demos/taro/demo5.tsx
@@ -5,8 +5,8 @@ import { Dongdong } from '@nutui/icons-react-taro'
 const Demo5 = () => {
   return (
     <Cell style={{ alignItems: 'center' }}>
-      <Dongdong size="16" style={{ marginRight: '10px' }} />
-      <Dongdong size="20" style={{ marginRight: '10px' }} />
+      <Dongdong size="16" style={{ marginRight: 10 }} />
+      <Dongdong size="20" style={{ marginRight: 10 }} />
       <Dongdong size="24" />
     </Cell>
   )
diff --git a/src/packages/icon/demos/taro/demo6.tsx b/src/packages/icon/demos/taro/demo6.tsx
index dea950d59e..1e820de5e9 100644
--- a/src/packages/icon/demos/taro/demo6.tsx
+++ b/src/packages/icon/demos/taro/demo6.tsx
@@ -53,7 +53,7 @@ const Demo6 = () => {
                       }}
                       style={{
                         maxWidth: '25%',
-                        height: '60px',
+                        height: 60,
                         display: 'flex',
                         flex: '0 0 25%',
                         flexDirection: 'column',
diff --git a/src/packages/icon/demos/taro/demo7.tsx b/src/packages/icon/demos/taro/demo7.tsx
index 94ea54df91..488a94398d 100644
--- a/src/packages/icon/demos/taro/demo7.tsx
+++ b/src/packages/icon/demos/taro/demo7.tsx
@@ -54,7 +54,7 @@ const Demo7 = () => {
                       }}
                       style={{
                         maxWidth: '25%',
-                        height: '60px',
+                        height: 60,
                         display: 'flex',
                         flex: '0 0 25%',
                         flexDirection: 'column',
diff --git a/src/packages/progress/demos/taro/demo6.tsx b/src/packages/progress/demos/taro/demo6.tsx
index 57d07342bd..07aca419f4 100644
--- a/src/packages/progress/demos/taro/demo6.tsx
+++ b/src/packages/progress/demos/taro/demo6.tsx
@@ -1,13 +1,16 @@
 import React from 'react'
 import { Progress, Cell } from '@nutui/nutui-react-taro'
 import { Checked, Tips } from '@nutui/icons-react-taro'
-import pxTransform from '@/utils/px-transform'
+import { harmony } from '@/utils/platform-taro'
 
 const Demo6 = () => {
   const iconStyle = {
     marginTop: 0,
-    marginLeft: pxTransform(5),
-    marginRight: pxTransform(5),
+    marginLeft: 5,
+    marginRight: 5,
+  }
+  const progressStyle = {
+    width: harmony() ? '95%' : '100%',
   }
   return (
     <>
@@ -19,7 +22,7 @@ const Demo6 = () => {
         />
       </Cell>
       <Cell align="center">
-        <Progress percent={100} />
+        <Progress percent={100} style={progressStyle} />
         <Checked color="green" style={iconStyle} />
       </Cell>
       <Cell align="center">
@@ -27,6 +30,7 @@ const Demo6 = () => {
           percent={100}
           color="linear-gradient(90deg, rgba(180,236,81,1) 0%,rgba(66,147,33,1) 100%)"
           strokeWidth="15"
+          style={progressStyle}
         />
         <Tips color="#FF0000" style={iconStyle} />
       </Cell>
diff --git a/src/packages/progress/demos/taro/demo7.tsx b/src/packages/progress/demos/taro/demo7.tsx
index 322e00c313..fd8e768b1c 100644
--- a/src/packages/progress/demos/taro/demo7.tsx
+++ b/src/packages/progress/demos/taro/demo7.tsx
@@ -1,7 +1,6 @@
 import React, { useState } from 'react'
 import { Cell, Button, Toast, Progress } from '@nutui/nutui-react-taro'
 import { Text } from '@tarojs/components'
-import pxTransform from '@/utils/px-transform'
 import { harmony } from '@/utils/platform-taro'
 
 const Demo7 = () => {
@@ -27,7 +26,7 @@ const Demo7 = () => {
       <Cell align="center">
         <Button
           type="default"
-          style={{ marginRight: pxTransform(16) }}
+          style={{ marginRight: 16 }}
           onClick={() => {
             if (value <= 0) {
               setToastMsg('进度已为0')
@@ -50,7 +49,7 @@ const Demo7 = () => {
         >
           增加
         </Button>
-        <Text style={{ marginLeft: pxTransform(16) }}>{value}%</Text>
+        <Text style={{ marginLeft: 16 }}>{value}%</Text>
       </Cell>
     </Cell.Group>
   )
diff --git a/src/packages/skeleton/demo.taro.tsx b/src/packages/skeleton/demo.taro.tsx
index 9fc6c71797..fe384b56c7 100644
--- a/src/packages/skeleton/demo.taro.tsx
+++ b/src/packages/skeleton/demo.taro.tsx
@@ -1,7 +1,6 @@
 import React from 'react'
 import Taro from '@tarojs/taro'
 import { ScrollView, View } from '@tarojs/components'
-import { Cell } from '@nutui/nutui-react-taro'
 import './demo.scss'
 import { useTranslate } from '@/sites/assets/locale/taro'
 import Header from '@/sites/components/header'
@@ -42,29 +41,19 @@ const SkeletonDemo = () => {
       <Header />
       <ScrollView className={`demo ${Taro.getEnv() === 'WEB' ? 'web' : ''}`}>
         <View className="h2">{translated['84aa6bce']}</View>
-        <Cell style={{ display: 'block', paddingTop: '3px' }}>
-          <Demo1 />
-        </Cell>
+        <Demo1 />
         <View className="h2">{translated.ea3bc18a}</View>
-        <Cell style={{ display: 'block' }}>
-          <Demo2 />
-        </Cell>
+        <Demo2 />
         <View className="h2">{translated['02a53df5']}</View>
-        <Cell>
-          <Demo3 />
-        </Cell>
+        <Demo3 />
         {harmony() ? null : (
           <>
             <View className="h2">{translated['0a001122']}</View>
-            <Cell style={{ display: 'block' }}>
-              <Demo4 />
-            </Cell>
+            <Demo4 />
           </>
         )}
         <View className="h2">{translated['07d62d5c']}</View>
-        <Cell>
-          <Demo5 />
-        </Cell>
+        <Demo5 />
       </ScrollView>
     </>
   )
diff --git a/src/packages/skeleton/demo.tsx b/src/packages/skeleton/demo.tsx
index e4b42d58b5..5e2cc79e2f 100644
--- a/src/packages/skeleton/demo.tsx
+++ b/src/packages/skeleton/demo.tsx
@@ -1,5 +1,4 @@
 import React from 'react'
-import Cell from '@/packages/cell'
 import { useTranslate } from '@/sites/assets/locale'
 import './demo.scss'
 import Demo1 from './demos/h5/demo1'
@@ -37,25 +36,15 @@ const SkeletonDemo = () => {
     <>
       <div className="demo">
         <h2>{translated['84aa6bce']}</h2>
-        <Cell style={{ display: 'block' }}>
-          <Demo1 />
-        </Cell>
+        <Demo1 />
         <h2>{translated.ea3bc18a}</h2>
-        <Cell style={{ display: 'block', paddingTop: '3px' }}>
-          <Demo2 />
-        </Cell>
+        <Demo2 />
         <h2>{translated['02a53df5']}</h2>
-        <Cell>
-          <Demo3 />
-        </Cell>
+        <Demo3 />
         <h2>{translated['0a001122']}</h2>
-        <Cell style={{ display: 'block' }}>
-          <Demo4 />
-        </Cell>
+        <Demo4 />
         <h2>{translated['07d62d5c']}</h2>
-        <Cell>
-          <Demo5 />
-        </Cell>
+        <Demo5 />
       </div>
     </>
   )
diff --git a/src/packages/skeleton/demos/h5/demo1.tsx b/src/packages/skeleton/demos/h5/demo1.tsx
index 7eafe0f800..568f0cb55b 100644
--- a/src/packages/skeleton/demos/h5/demo1.tsx
+++ b/src/packages/skeleton/demos/h5/demo1.tsx
@@ -1,7 +1,11 @@
 import React from 'react'
-import { Skeleton } from '@nutui/nutui-react'
+import { Cell, Skeleton } from '@nutui/nutui-react'
 
 const Demo1 = () => {
-  return <Skeleton animated />
+  return (
+    <Cell style={{ display: 'block' }}>
+      <Skeleton animated />
+    </Cell>
+  )
 }
 export default Demo1
diff --git a/src/packages/skeleton/demos/h5/demo2.tsx b/src/packages/skeleton/demos/h5/demo2.tsx
index ab7450a834..ba33053f22 100644
--- a/src/packages/skeleton/demos/h5/demo2.tsx
+++ b/src/packages/skeleton/demos/h5/demo2.tsx
@@ -1,7 +1,11 @@
 import React from 'react'
-import { Skeleton } from '@nutui/nutui-react'
+import { Cell, Skeleton } from '@nutui/nutui-react'
 
 const Demo2 = () => {
-  return <Skeleton rows={3} title animated />
+  return (
+    <Cell style={{ display: 'block', paddingTop: '3px' }}>
+      <Skeleton rows={3} title animated />
+    </Cell>
+  )
 }
 export default Demo2
diff --git a/src/packages/skeleton/demos/h5/demo3.tsx b/src/packages/skeleton/demos/h5/demo3.tsx
index ba71164d66..33ac5a533b 100644
--- a/src/packages/skeleton/demos/h5/demo3.tsx
+++ b/src/packages/skeleton/demos/h5/demo3.tsx
@@ -1,7 +1,11 @@
 import React from 'react'
-import { Skeleton } from '@nutui/nutui-react'
+import { Cell, Skeleton } from '@nutui/nutui-react'
 
 const Demo3 = () => {
-  return <Skeleton rows={3} title animated avatar avatarSize="100px" />
+  return (
+    <Cell>
+      <Skeleton rows={3} title animated avatar avatarSize="100px" />
+    </Cell>
+  )
 }
 export default Demo3
diff --git a/src/packages/skeleton/demos/h5/demo4.tsx b/src/packages/skeleton/demos/h5/demo4.tsx
index 2fc57b7de4..48671847d9 100644
--- a/src/packages/skeleton/demos/h5/demo4.tsx
+++ b/src/packages/skeleton/demos/h5/demo4.tsx
@@ -1,15 +1,17 @@
 import React from 'react'
-import { Skeleton, ConfigProvider } from '@nutui/nutui-react'
+import { Cell, Skeleton, ConfigProvider } from '@nutui/nutui-react'
 
 const Demo4 = () => {
   return (
-    <ConfigProvider
-      theme={{
-        nutuiSkeletonLineBorderRadius: '10px',
-      }}
-    >
-      <Skeleton rows={3} animated />
-    </ConfigProvider>
+    <Cell style={{ display: 'block' }}>
+      <ConfigProvider
+        theme={{
+          nutuiSkeletonLineBorderRadius: '10px',
+        }}
+      >
+        <Skeleton rows={3} animated />
+      </ConfigProvider>
+    </Cell>
   )
 }
 export default Demo4
diff --git a/src/packages/skeleton/demos/h5/demo5.tsx b/src/packages/skeleton/demos/h5/demo5.tsx
index a0930586c3..68de14ddd5 100644
--- a/src/packages/skeleton/demos/h5/demo5.tsx
+++ b/src/packages/skeleton/demos/h5/demo5.tsx
@@ -1,4 +1,4 @@
-import { Avatar, Image, Skeleton, Switch } from '@nutui/nutui-react'
+import { Cell, Avatar, Image, Skeleton, Switch } from '@nutui/nutui-react'
 import React, { useState } from 'react'
 
 const Demo5 = () => {
@@ -11,32 +11,34 @@ const Demo5 = () => {
     setChecked(value)
   }
   return (
-    <div style={{ width: '100%' }}>
-      <Switch
-        onChange={(value, event) => changeStatus(value, event)}
-        style={{ marginBottom: '8px' }}
-      />
-      <Skeleton title animated avatar rows={3} visible={checked}>
-        <div className="nut-skeleton-content">
-          <Avatar
-            className="nut-skeleton-content-avatar"
-            size="50"
-            icon={
-              <Image
-                loading={false}
-                src="https://img14.360buyimg.com/imagetools/jfs/t1/167902/2/8762/791358/603742d7E9b4275e3/e09d8f9a8bf4c0ef.png"
-              />
-            }
-          />
-          <div>
-            <span>NutUI-React</span>
+    <Cell>
+      <div style={{ width: '100%' }}>
+        <Switch
+          onChange={(value, event) => changeStatus(value, event)}
+          style={{ marginBottom: '8px' }}
+        />
+        <Skeleton title animated avatar rows={3} visible={checked}>
+          <div className="nut-skeleton-content">
+            <Avatar
+              className="nut-skeleton-content-avatar"
+              size="50"
+              icon={
+                <Image
+                  loading={false}
+                  src="https://img14.360buyimg.com/imagetools/jfs/t1/167902/2/8762/791358/603742d7E9b4275e3/e09d8f9a8bf4c0ef.png"
+                />
+              }
+            />
             <div>
-              一套京东风格的轻量级移动端React组件库，提供丰富的基础组件和业务组件，帮助开发者快速搭建移动应用。
+              <span>NutUI-React</span>
+              <div>
+                一套京东风格的轻量级移动端React组件库，提供丰富的基础组件和业务组件，帮助开发者快速搭建移动应用。
+              </div>
             </div>
           </div>
-        </div>
-      </Skeleton>
-    </div>
+        </Skeleton>
+      </div>
+    </Cell>
   )
 }
 export default Demo5
diff --git a/src/packages/skeleton/demos/taro/demo1.tsx b/src/packages/skeleton/demos/taro/demo1.tsx
index a18085573d..072b8236ee 100644
--- a/src/packages/skeleton/demos/taro/demo1.tsx
+++ b/src/packages/skeleton/demos/taro/demo1.tsx
@@ -1,7 +1,11 @@
 import React from 'react'
-import { Skeleton } from '@nutui/nutui-react-taro'
+import { Cell, Skeleton } from '@nutui/nutui-react-taro'
 
 const Demo1 = () => {
-  return <Skeleton animated />
+  return (
+    <Cell style={{ display: 'block', paddingTop: '3px' }}>
+      <Skeleton animated />
+    </Cell>
+  )
 }
 export default Demo1
diff --git a/src/packages/skeleton/demos/taro/demo2.tsx b/src/packages/skeleton/demos/taro/demo2.tsx
index c866d16330..b0b5cac29e 100644
--- a/src/packages/skeleton/demos/taro/demo2.tsx
+++ b/src/packages/skeleton/demos/taro/demo2.tsx
@@ -1,7 +1,11 @@
 import React from 'react'
-import { Skeleton } from '@nutui/nutui-react-taro'
+import { Cell, Skeleton } from '@nutui/nutui-react-taro'
 
 const Demo2 = () => {
-  return <Skeleton rows={3} title animated />
+  return (
+    <Cell style={{ display: 'block' }}>
+      <Skeleton rows={3} title animated />
+    </Cell>
+  )
 }
 export default Demo2
diff --git a/src/packages/skeleton/demos/taro/demo3.tsx b/src/packages/skeleton/demos/taro/demo3.tsx
index bcd7ff4fda..204137ad8f 100644
--- a/src/packages/skeleton/demos/taro/demo3.tsx
+++ b/src/packages/skeleton/demos/taro/demo3.tsx
@@ -1,7 +1,11 @@
 import React from 'react'
-import { Skeleton } from '@nutui/nutui-react-taro'
+import { Cell, Skeleton } from '@nutui/nutui-react-taro'
 
 const Demo3 = () => {
-  return <Skeleton rows={3} title animated avatar avatarSize="100px" />
+  return (
+    <Cell>
+      <Skeleton rows={3} title animated avatar avatarSize="100px" />
+    </Cell>
+  )
 }
 export default Demo3
diff --git a/src/packages/skeleton/demos/taro/demo4.tsx b/src/packages/skeleton/demos/taro/demo4.tsx
index aa9fce8875..c061b0d2a3 100644
--- a/src/packages/skeleton/demos/taro/demo4.tsx
+++ b/src/packages/skeleton/demos/taro/demo4.tsx
@@ -1,15 +1,17 @@
 import React from 'react'
-import { Skeleton, ConfigProvider } from '@nutui/nutui-react-taro'
+import { Cell, Skeleton, ConfigProvider } from '@nutui/nutui-react-taro'
 
 const Demo4 = () => {
   return (
-    <ConfigProvider
-      theme={{
-        nutuiSkeletonLineBorderRadius: '10px',
-      }}
-    >
-      <Skeleton rows={3} animated />
-    </ConfigProvider>
+    <Cell style={{ display: 'block' }}>
+      <ConfigProvider
+        theme={{
+          nutuiSkeletonLineBorderRadius: '10px',
+        }}
+      >
+        <Skeleton rows={3} animated />
+      </ConfigProvider>
+    </Cell>
   )
 }
 export default Demo4
diff --git a/src/packages/skeleton/demos/taro/demo5.tsx b/src/packages/skeleton/demos/taro/demo5.tsx
index 7cf397d389..87d7a25b0f 100644
--- a/src/packages/skeleton/demos/taro/demo5.tsx
+++ b/src/packages/skeleton/demos/taro/demo5.tsx
@@ -1,6 +1,7 @@
-import { Avatar, Skeleton, Switch } from '@nutui/nutui-react-taro'
+import { Avatar, Cell, Skeleton, Switch } from '@nutui/nutui-react-taro'
 import React, { useState } from 'react'
 import { View, Text } from '@tarojs/components'
+import { harmony } from '@/utils/platform-taro'
 
 const Demo5 = () => {
   const [checked, setChecked] = useState(false)
@@ -12,38 +13,42 @@ const Demo5 = () => {
     setChecked(value)
   }
   return (
-    <View style={{ width: '100%' }}>
-      <View
-        style={{
-          display: 'flex',
-          justifyContent: 'flex-start',
-        }}
-      >
-        <Switch
-          onChange={(value, event: any) => changeStatus(value, event)}
-          style={{ marginBottom: 8 }}
-        />
-      </View>
-      <Skeleton title animated avatar rows={3} visible={checked}>
+    <Cell>
+      <View style={{ width: '100%' }}>
         <View
-          className="nut-skeleton-content"
-          style={{ display: 'flex', flexDirection: 'row' }}
+          style={{
+            display: 'flex',
+            justifyContent: 'flex-start',
+          }}
         >
-          <Avatar
-            className="nut-skeleton-content-avatar"
-            style={{ marginRight: '20px' }}
-            size="50"
-            src="https://img14.360buyimg.com/imagetools/jfs/t1/167902/2/8762/791358/603742d7E9b4275e3/e09d8f9a8bf4c0ef.png"
+          <Switch
+            onChange={(value, event: any) => changeStatus(value, event)}
+            style={{ marginBottom: 8 }}
           />
-          <View className="nut-skeleton-content-line">
-            <Text>NutUI-React</Text>
-            <View style={{ marginTop: '10px', width: '70%' }}>
-              一套京东风格的轻量级移动端React组件库，提供丰富的基础组件和业务组件，帮助开发者快速搭建移动应用。
+        </View>
+        <Skeleton title animated avatar rows={3} visible={checked}>
+          <View
+            className="nut-skeleton-content"
+            style={{ display: 'flex', flexDirection: 'row' }}
+          >
+            <Avatar
+              className="nut-skeleton-content-avatar"
+              style={{ marginRight: 20 }}
+              size="50"
+              src="https://img14.360buyimg.com/imagetools/jfs/t1/167902/2/8762/791358/603742d7E9b4275e3/e09d8f9a8bf4c0ef.png"
+            />
+            <View className="nut-skeleton-content-line">
+              <Text>NutUI-React</Text>
+              <View
+                style={{ marginTop: 10, width: harmony() ? '80%' : '100%' }}
+              >
+                一套京东风格的轻量级移动端React组件库，提供丰富的基础组件和业务组件，帮助开发者快速搭建移动应用。
+              </View>
             </View>
           </View>
-        </View>
-      </Skeleton>
-    </View>
+        </Skeleton>
+      </View>
+    </Cell>
   )
 }
 export default Demo5

From 6addfb731ea4f5fd9c722d69a217246fbebb00e3 Mon Sep 17 00:00:00 2001
From: hanyuxinting <hanyuxinting@sina.cn>
Date: Wed, 19 Feb 2025 18:56:38 +0800
Subject: [PATCH 2/4] =?UTF-8?q?fix:=20=E8=B5=B0=E6=9F=A5=E9=B8=BF=E8=92=99?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/packages/actionsheet/demos/taro/demo1.tsx   |  5 ++++-
 src/packages/actionsheet/demos/taro/demo2.tsx   |  5 ++++-
 src/packages/actionsheet/demos/taro/demo3.tsx   |  5 ++++-
 src/packages/actionsheet/demos/taro/demo5.tsx   |  5 +++--
 src/packages/avatar/demos/taro/demo9.tsx        |  7 ++++---
 src/packages/card/demos/taro/demo2.tsx          |  2 +-
 src/packages/card/demos/taro/demo3.tsx          |  9 +++++----
 src/packages/card/demos/taro/demo5.tsx          |  3 ++-
 src/packages/card/demos/taro/demo6.tsx          |  2 +-
 src/packages/cell/demos/taro/demo3.tsx          | 11 ++++++-----
 src/packages/cell/demos/taro/demo6.tsx          | 17 ++++++++++-------
 .../configprovider/demos/taro/demo5.tsx         |  7 +++++--
 src/packages/countdown/demos/taro/demo8.tsx     | 13 +++++++------
 src/packages/divider/demos/taro/demo5.tsx       |  5 +++--
 src/packages/icon/demos/taro/demo1.tsx          |  1 -
 src/packages/progress/demos/taro/demo6.tsx      |  5 +++--
 src/packages/progress/demos/taro/demo7.tsx      |  5 +++--
 17 files changed, 65 insertions(+), 42 deletions(-)

diff --git a/src/packages/actionsheet/demos/taro/demo1.tsx b/src/packages/actionsheet/demos/taro/demo1.tsx
index 276a907fe3..a886365e03 100644
--- a/src/packages/actionsheet/demos/taro/demo1.tsx
+++ b/src/packages/actionsheet/demos/taro/demo1.tsx
@@ -1,6 +1,7 @@
 import React, { useState } from 'react'
 import { ActionSheet, Cell } from '@nutui/nutui-react-taro'
 import { View } from '@tarojs/components'
+import pxTransform from '@/utils/px-transform'
 
 const Demo1 = () => {
   const [val, setVal] = useState('')
@@ -26,7 +27,9 @@ const Demo1 = () => {
     <>
       <Cell onClick={() => setIsVisible(!isVisible)}>
         <View>基础用法</View>
-        <View style={{ marginLeft: 10, color: '#999' }}>{val}</View>
+        <View style={{ marginLeft: pxTransform(10), color: '#999' }}>
+          {val}
+        </View>
       </Cell>
       <ActionSheet
         title="标题"
diff --git a/src/packages/actionsheet/demos/taro/demo2.tsx b/src/packages/actionsheet/demos/taro/demo2.tsx
index f287a551c3..9abf1ac1d4 100644
--- a/src/packages/actionsheet/demos/taro/demo2.tsx
+++ b/src/packages/actionsheet/demos/taro/demo2.tsx
@@ -1,6 +1,7 @@
 import React, { useState } from 'react'
 import { ActionSheet, Cell } from '@nutui/nutui-react-taro'
 import { View } from '@tarojs/components'
+import pxTransform from '@/utils/px-transform'
 
 const Demo2 = () => {
   const [isVisible, setIsVisible] = useState(false)
@@ -24,7 +25,9 @@ const Demo2 = () => {
     <>
       <Cell onClick={() => setIsVisible(!isVisible)}>
         <View>展示取消按钮</View>
-        <View style={{ marginLeft: 10, color: '#999' }}>{val}</View>
+        <View style={{ marginLeft: pxTransform(10), color: '#999' }}>
+          {val}
+        </View>
       </Cell>
       <ActionSheet
         visible={isVisible}
diff --git a/src/packages/actionsheet/demos/taro/demo3.tsx b/src/packages/actionsheet/demos/taro/demo3.tsx
index d7c6e6873a..8d5ed1d1c4 100644
--- a/src/packages/actionsheet/demos/taro/demo3.tsx
+++ b/src/packages/actionsheet/demos/taro/demo3.tsx
@@ -1,6 +1,7 @@
 import React, { useState } from 'react'
 import { ActionSheet, Cell } from '@nutui/nutui-react-taro'
 import { View } from '@tarojs/components'
+import pxTransform from '@/utils/px-transform'
 
 const Demo3 = () => {
   const [isVisible, setIsVisible] = useState(false)
@@ -25,7 +26,9 @@ const Demo3 = () => {
     <>
       <Cell onClick={() => setIsVisible(!isVisible)}>
         <View>展示描述信息</View>
-        <View style={{ marginLeft: 10, color: '#999' }}>{val}</View>
+        <View style={{ marginLeft: pxTransform(10), color: '#999' }}>
+          {val}
+        </View>
       </Cell>
       <ActionSheet
         visible={isVisible}
diff --git a/src/packages/actionsheet/demos/taro/demo5.tsx b/src/packages/actionsheet/demos/taro/demo5.tsx
index 56837feba4..cf39a8f2d4 100644
--- a/src/packages/actionsheet/demos/taro/demo5.tsx
+++ b/src/packages/actionsheet/demos/taro/demo5.tsx
@@ -1,13 +1,14 @@
 import React, { CSSProperties, useState } from 'react'
 import { ActionSheet, Cell } from '@nutui/nutui-react-taro'
 import { View } from '@tarojs/components'
+import pxTransform from '@/utils/px-transform'
 
 const Demo5 = () => {
   const [isVisible, setIsVisible] = useState(false)
   const viewStyle: CSSProperties = {
     textAlign: 'left',
-    paddingLeft: 20,
-    paddingTop: 10,
+    paddingLeft: pxTransform(20),
+    paddingTop: pxTransform(10),
   }
   return (
     <>
diff --git a/src/packages/avatar/demos/taro/demo9.tsx b/src/packages/avatar/demos/taro/demo9.tsx
index b2fda9a200..52d109a6a2 100644
--- a/src/packages/avatar/demos/taro/demo9.tsx
+++ b/src/packages/avatar/demos/taro/demo9.tsx
@@ -1,17 +1,18 @@
 import React from 'react'
 import { View } from '@tarojs/components'
 import { Avatar, Cell } from '@nutui/nutui-react-taro'
+import pxTransform from '@/utils/px-transform'
 
 const Demo9 = () => {
   return (
     <Cell className="cell-avatar">
       <Avatar
         src="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png"
-        style={{ marginRight: 10 }}
+        style={{ marginRight: pxTransform(10) }}
       />
       <View>
-        <View style={{ fontSize: 16 }}>标题</View>
-        <View style={{ fontSize: 12 }}>描述信息</View>
+        <View style={{ fontSize: pxTransform(16) }}>标题</View>
+        <View style={{ fontSize: pxTransform(12) }}>描述信息</View>
       </View>
     </Cell>
   )
diff --git a/src/packages/card/demos/taro/demo2.tsx b/src/packages/card/demos/taro/demo2.tsx
index b92f704d52..9499fb5903 100644
--- a/src/packages/card/demos/taro/demo2.tsx
+++ b/src/packages/card/demos/taro/demo2.tsx
@@ -15,7 +15,7 @@ const Demo2 = () => {
     shopName: '阳澄湖大闸蟹自营店>',
   }
   const wordStyles = {
-    marginRight: 5,
+    marginRight: pxTransform(5),
   }
   return (
     <Card
diff --git a/src/packages/card/demos/taro/demo3.tsx b/src/packages/card/demos/taro/demo3.tsx
index 28726ee9c8..fec72569bb 100644
--- a/src/packages/card/demos/taro/demo3.tsx
+++ b/src/packages/card/demos/taro/demo3.tsx
@@ -1,5 +1,6 @@
 import React from 'react'
 import { Card, Image } from '@nutui/nutui-react-taro'
+import pxTransform from '@/utils/px-transform'
 
 const Demo3 = () => {
   const state = {
@@ -14,8 +15,8 @@ const Demo3 = () => {
   }
   const tagStyles = {
     display: 'inline-flex',
-    marginRight: 5,
-    marginLeft: 2,
+    marginRight: pxTransform(5),
+    marginLeft: pxTransform(2),
   }
   return (
     <Card
@@ -29,8 +30,8 @@ const Demo3 = () => {
       priceTag={
         <Image
           style={tagStyles}
-          height={14}
-          width={29}
+          height={pxTransform(14)}
+          width={pxTransform(29)}
           src="https://img11.360buyimg.com/jdphoto/s58x28_jfs/t9451/359/415622649/15318/b0943e5d/59a78495N3bd2a9f8.png"
         />
       }
diff --git a/src/packages/card/demos/taro/demo5.tsx b/src/packages/card/demos/taro/demo5.tsx
index 0ad2ce597a..0d334624ab 100644
--- a/src/packages/card/demos/taro/demo5.tsx
+++ b/src/packages/card/demos/taro/demo5.tsx
@@ -1,6 +1,7 @@
 import React from 'react'
 import { View } from '@tarojs/components'
 import { Card } from '@nutui/nutui-react-taro'
+import pxTransform from '@/utils/px-transform'
 
 const Demo5 = () => {
   const state = {
@@ -23,7 +24,7 @@ const Demo5 = () => {
       shopDescription={state.shopDescription}
       delivery={state.delivery}
       shopName={state.shopName}
-      extra={<View style={{ fontSize: 12 }}>自定义</View>}
+      extra={<View style={{ fontSize: pxTransform(12) }}>自定义</View>}
     />
   )
 }
diff --git a/src/packages/card/demos/taro/demo6.tsx b/src/packages/card/demos/taro/demo6.tsx
index be0323bc22..9d49c84533 100644
--- a/src/packages/card/demos/taro/demo6.tsx
+++ b/src/packages/card/demos/taro/demo6.tsx
@@ -17,7 +17,7 @@ const Demo6 = () => {
       description={
         <View
           style={{
-            fontSize: 12,
+            fontSize: pxTransform(14),
             padding: `${pxTransform(10)} 0`,
             color: '#999',
           }}
diff --git a/src/packages/cell/demos/taro/demo3.tsx b/src/packages/cell/demos/taro/demo3.tsx
index 26bd49ca18..555929e10a 100644
--- a/src/packages/cell/demos/taro/demo3.tsx
+++ b/src/packages/cell/demos/taro/demo3.tsx
@@ -2,6 +2,7 @@ import React from 'react'
 import { Cell } from '@nutui/nutui-react-taro'
 import { View, Text } from '@tarojs/components'
 import { User } from '@nutui/icons-react-taro'
+import pxTransform from '@/utils/px-transform'
 
 const Demo3 = () => {
   return (
@@ -12,11 +13,11 @@ const Demo3 = () => {
             display: 'flex',
             alignItems: 'center',
             flexDirection: 'row',
-            height: 20,
+            height: pxTransform(20),
           }}
         >
           <User size={16} />
-          <View style={{ marginLeft: 5 }}>我是标题</View>
+          <View style={{ marginLeft: pxTransform(5) }}>我是标题</View>
         </View>
       }
       description={
@@ -25,13 +26,13 @@ const Demo3 = () => {
             display: 'flex',
             flexDirection: 'row',
             alignItems: 'center',
-            fontSize: 12,
+            fontSize: pxTransform(12),
             color: '#505259',
-            height: 20,
+            height: pxTransform(20),
           }}
         >
           我是描述
-          <Text style={{ color: 'red', fontSize: 12 }}>1</Text>
+          <Text style={{ color: 'red', fontSize: pxTransform(12) }}>1</Text>
         </View>
       }
       extra="描述文字"
diff --git a/src/packages/cell/demos/taro/demo6.tsx b/src/packages/cell/demos/taro/demo6.tsx
index c27733b945..55eb305923 100644
--- a/src/packages/cell/demos/taro/demo6.tsx
+++ b/src/packages/cell/demos/taro/demo6.tsx
@@ -3,6 +3,7 @@ import { Button, Cell } from '@nutui/nutui-react-taro'
 import { navigateTo, redirectTo } from '@tarojs/taro'
 import { ArrowRight, User } from '@nutui/icons-react-taro'
 import { ITouchEvent, Text, View } from '@tarojs/components'
+import pxTransform from '@/utils/px-transform'
 
 const Demo6 = () => {
   const onJumpclick = (
@@ -28,7 +29,9 @@ const Demo6 = () => {
           title="URL 跳转"
           extra={
             <>
-              <View style={{ marginRight: 5 }}>/pages/index/index</View>
+              <View style={{ marginRight: pxTransform(5) }}>
+                /pages/index/index
+              </View>
               <ArrowRight />
             </>
           }
@@ -49,12 +52,12 @@ const Demo6 = () => {
                 flexDirection: 'row',
               }}
             >
-              <View style={{ fontWeight: 500 }}>我是标题</View>
+              <View style={{ fontWeight: pxTransform(500) }}>我是标题</View>
               <View
                 style={{
                   color: '#888B94',
-                  fontSize: 10,
-                  marginLeft: 5,
+                  fontSize: pxTransform(10),
+                  marginLeft: pxTransform(5),
                 }}
               >
                 我是描述
@@ -75,7 +78,7 @@ const Demo6 = () => {
           }
         />
         <Cell>
-          <View style={{ minHeight: 50 }}>自定义内容</View>
+          <View style={{ minHeight: pxTransform(50) }}>自定义内容</View>
         </Cell>
         <Cell
           align="center"
@@ -83,7 +86,7 @@ const Demo6 = () => {
             <Text
               style={{
                 color: '#888B94',
-                fontSize: 12,
+                fontSize: pxTransform(12),
               }}
             >
               我是描述
@@ -114,7 +117,7 @@ const Demo6 = () => {
           extra={<ArrowRight />}
         />
         <Cell>
-          <View style={{ minHeight: 50 }}>自定义内容</View>
+          <View style={{ minHeight: pxTransform(50) }}>自定义内容</View>
         </Cell>
         <Cell
           align="center"
diff --git a/src/packages/configprovider/demos/taro/demo5.tsx b/src/packages/configprovider/demos/taro/demo5.tsx
index a1a48b7f53..a9fd054fbd 100644
--- a/src/packages/configprovider/demos/taro/demo5.tsx
+++ b/src/packages/configprovider/demos/taro/demo5.tsx
@@ -1,6 +1,7 @@
 import React from 'react'
 import { View, Text } from '@tarojs/components'
 import { ConfigProvider, Cell } from '@nutui/nutui-react-taro'
+import pxTransform from '@/utils/px-transform'
 
 const Demo5 = () => {
   return (
@@ -9,11 +10,13 @@ const Demo5 = () => {
         <Cell
           title={
             <View>
-              <Text style={{ fontSize: 14 }}>我是标题</Text>
+              <Text style={{ fontSize: pxTransform(14) }}>我是标题</Text>
             </View>
           }
           description={
-            <Text style={{ fontSize: 12, color: '#ccc' }}>我是描述</Text>
+            <Text style={{ fontSize: pxTransform(12), color: '#ccc' }}>
+              我是描述
+            </Text>
           }
           extra="描述文字"
         />
diff --git a/src/packages/countdown/demos/taro/demo8.tsx b/src/packages/countdown/demos/taro/demo8.tsx
index 4ad0448121..34bf360b11 100644
--- a/src/packages/countdown/demos/taro/demo8.tsx
+++ b/src/packages/countdown/demos/taro/demo8.tsx
@@ -1,6 +1,7 @@
 import React, { useRef, useState } from 'react'
 import { Cell, CountDown } from '@nutui/nutui-react-taro'
 import { View } from '@tarojs/components'
+import pxTransform from '@/utils/px-transform'
 
 const partItemStyle = {
   display: 'flex',
@@ -9,15 +10,15 @@ const partItemStyle = {
   backgroundColor: '#fa2c19',
   color: '#fff',
   ...{
-    width: 20,
-    height: 25,
-    fontSize: 14,
-    borderRadius: 6,
+    width: pxTransform(20),
+    height: pxTransform(25),
+    fontSize: pxTransform(14),
+    borderRadius: pxTransform(6),
   },
 }
 const partItemSymbolStyle = {
-  marginLeft: 5,
-  marginRight: 5,
+  marginLeft: pxTransform(5),
+  marginRight: pxTransform(5),
 }
 
 const Demo8 = () => {
diff --git a/src/packages/divider/demos/taro/demo5.tsx b/src/packages/divider/demos/taro/demo5.tsx
index aa9de9a56b..75cb956edd 100644
--- a/src/packages/divider/demos/taro/demo5.tsx
+++ b/src/packages/divider/demos/taro/demo5.tsx
@@ -1,5 +1,6 @@
 import React from 'react'
 import { Cell, Divider } from '@nutui/nutui-react-taro'
+import pxTransform from '@/utils/px-transform'
 
 const Demo5 = () => {
   return (
@@ -7,8 +8,8 @@ const Demo5 = () => {
       <Divider
         style={{
           color: '#0073ff',
-          paddingLeft: 16,
-          paddingRight: 16,
+          paddingLeft: pxTransform(16),
+          paddingRight: pxTransform(16),
           borderColor: '#0073ff',
           borderStyle: 'dashed',
         }}
diff --git a/src/packages/icon/demos/taro/demo1.tsx b/src/packages/icon/demos/taro/demo1.tsx
index adcf89dd39..720abb018b 100644
--- a/src/packages/icon/demos/taro/demo1.tsx
+++ b/src/packages/icon/demos/taro/demo1.tsx
@@ -3,7 +3,6 @@ import { Cell } from '@nutui/nutui-react-taro'
 import { Add, Dongdong, UserAdd, Minus } from '@nutui/icons-react-taro'
 
 const Demo1 = () => {
-  console.log('dddd')
   return (
     <Cell>
       <Add color="red" style={{ marginRight: 10 }} />
diff --git a/src/packages/progress/demos/taro/demo6.tsx b/src/packages/progress/demos/taro/demo6.tsx
index 07aca419f4..baf26a46e4 100644
--- a/src/packages/progress/demos/taro/demo6.tsx
+++ b/src/packages/progress/demos/taro/demo6.tsx
@@ -2,12 +2,13 @@ import React from 'react'
 import { Progress, Cell } from '@nutui/nutui-react-taro'
 import { Checked, Tips } from '@nutui/icons-react-taro'
 import { harmony } from '@/utils/platform-taro'
+import pxTransform from '@/utils/px-transform'
 
 const Demo6 = () => {
   const iconStyle = {
     marginTop: 0,
-    marginLeft: 5,
-    marginRight: 5,
+    marginLeft: pxTransform(5),
+    marginRight: pxTransform(5),
   }
   const progressStyle = {
     width: harmony() ? '95%' : '100%',
diff --git a/src/packages/progress/demos/taro/demo7.tsx b/src/packages/progress/demos/taro/demo7.tsx
index fd8e768b1c..322e00c313 100644
--- a/src/packages/progress/demos/taro/demo7.tsx
+++ b/src/packages/progress/demos/taro/demo7.tsx
@@ -1,6 +1,7 @@
 import React, { useState } from 'react'
 import { Cell, Button, Toast, Progress } from '@nutui/nutui-react-taro'
 import { Text } from '@tarojs/components'
+import pxTransform from '@/utils/px-transform'
 import { harmony } from '@/utils/platform-taro'
 
 const Demo7 = () => {
@@ -26,7 +27,7 @@ const Demo7 = () => {
       <Cell align="center">
         <Button
           type="default"
-          style={{ marginRight: 16 }}
+          style={{ marginRight: pxTransform(16) }}
           onClick={() => {
             if (value <= 0) {
               setToastMsg('进度已为0')
@@ -49,7 +50,7 @@ const Demo7 = () => {
         >
           增加
         </Button>
-        <Text style={{ marginLeft: 16 }}>{value}%</Text>
+        <Text style={{ marginLeft: pxTransform(16) }}>{value}%</Text>
       </Cell>
     </Cell.Group>
   )

From 70cecbf9db0106826700e6663c84c966a29a248a Mon Sep 17 00:00:00 2001
From: hanyuxinting <hanyuxinting@sina.cn>
Date: Wed, 19 Feb 2025 19:09:23 +0800
Subject: [PATCH 3/4] fix: harmony adaptions

---
 src/packages/avatar/demo.scss                 |  6 ------
 src/packages/avatar/demos/h5/demo1.tsx        |  3 +++
 src/packages/avatar/demos/h5/demo2.tsx        |  3 ++-
 src/packages/avatar/demos/h5/demo3.tsx        |  8 ++++++--
 src/packages/avatar/demos/h5/demo4.tsx        |  2 ++
 src/packages/avatar/demos/h5/demo5.tsx        |  3 ++-
 src/packages/avatar/demos/taro/demo1.tsx      |  7 ++++++-
 src/packages/avatar/demos/taro/demo2.tsx      |  3 ++-
 src/packages/avatar/demos/taro/demo3.tsx      |  8 ++++++--
 src/packages/avatar/demos/taro/demo4.tsx      |  2 ++
 src/packages/avatar/demos/taro/demo5.tsx      | 18 ++++++++----------
 src/packages/hoverbutton/demos/taro/demo6.tsx |  2 --
 src/packages/swiper/demos/taro/demo5.tsx      |  5 ++---
 13 files changed, 41 insertions(+), 29 deletions(-)

diff --git a/src/packages/avatar/demo.scss b/src/packages/avatar/demo.scss
index e5934b9b93..ff0ac25f63 100644
--- a/src/packages/avatar/demo.scss
+++ b/src/packages/avatar/demo.scss
@@ -2,10 +2,4 @@
 .avatar-demo .nut-cell {
   align-items: flex-end;
   border-radius: 0;
-
-  & > div,
-  & > taro-view-core,
-  & > view {
-    margin-inline-end: 30px;
-  }
 }
diff --git a/src/packages/avatar/demos/h5/demo1.tsx b/src/packages/avatar/demos/h5/demo1.tsx
index 48b5b53c70..efca981431 100644
--- a/src/packages/avatar/demos/h5/demo1.tsx
+++ b/src/packages/avatar/demos/h5/demo1.tsx
@@ -2,15 +2,18 @@ import React from 'react'
 import { Avatar, Cell } from '@nutui/nutui-react'
 
 const Demo1 = () => {
+  const styles = { marginRight: '30px' }
   return (
     <Cell align="flex-end">
       <Avatar
         size="large"
         src="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png"
+        style={styles}
       />
       <Avatar
         size="normal"
         src="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png"
+        style={styles}
       />
       <Avatar
         size="small"
diff --git a/src/packages/avatar/demos/h5/demo2.tsx b/src/packages/avatar/demos/h5/demo2.tsx
index 6da5283dcc..8f859793a5 100644
--- a/src/packages/avatar/demos/h5/demo2.tsx
+++ b/src/packages/avatar/demos/h5/demo2.tsx
@@ -3,9 +3,10 @@ import { Avatar, Cell } from '@nutui/nutui-react'
 import { User } from '@nutui/icons-react'
 
 const Demo2 = () => {
+  const styles = { marginRight: '30px' }
   return (
     <Cell>
-      <Avatar icon={<User />} shape="square" />
+      <Avatar icon={<User />} shape="square" style={styles} />
       <Avatar icon={<User />} shape="round" />
     </Cell>
   )
diff --git a/src/packages/avatar/demos/h5/demo3.tsx b/src/packages/avatar/demos/h5/demo3.tsx
index 762d8d855e..ff65873d4b 100644
--- a/src/packages/avatar/demos/h5/demo3.tsx
+++ b/src/packages/avatar/demos/h5/demo3.tsx
@@ -3,10 +3,14 @@ import { Avatar, Cell } from '@nutui/nutui-react'
 import { User } from '@nutui/icons-react'
 
 const Demo3 = () => {
+  const styles = { marginRight: '30px' }
   return (
     <Cell>
-      <Avatar src="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png" />
-      <Avatar icon={<User />} />
+      <Avatar
+        src="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png"
+        style={styles}
+      />
+      <Avatar icon={<User />} style={styles} />
       <Avatar>N</Avatar>
     </Cell>
   )
diff --git a/src/packages/avatar/demos/h5/demo4.tsx b/src/packages/avatar/demos/h5/demo4.tsx
index b2b9cf73d1..ec116b2d71 100644
--- a/src/packages/avatar/demos/h5/demo4.tsx
+++ b/src/packages/avatar/demos/h5/demo4.tsx
@@ -3,12 +3,14 @@ import { Avatar, Cell } from '@nutui/nutui-react'
 import { User } from '@nutui/icons-react'
 
 const Demo4 = () => {
+  const styles = { marginRight: '30px' }
   return (
     <Cell>
       <Avatar
         color="#fff"
         background="var(--nutui-color-primary)"
         icon={<User />}
+        style={styles}
       />
       <Avatar
         color="var(--nutui-color-primary)"
diff --git a/src/packages/avatar/demos/h5/demo5.tsx b/src/packages/avatar/demos/h5/demo5.tsx
index 9dd01c596d..deca177b7a 100644
--- a/src/packages/avatar/demos/h5/demo5.tsx
+++ b/src/packages/avatar/demos/h5/demo5.tsx
@@ -3,9 +3,10 @@ import { Avatar, Badge, Cell } from '@nutui/nutui-react'
 import { User } from '@nutui/icons-react'
 
 const Demo5 = () => {
+  const styles = { marginRight: '30px' }
   return (
     <Cell>
-      <Badge value="8">
+      <Badge value="8" style={styles}>
         <Avatar icon={<User />} shape="square" />
       </Badge>
       <Badge dot>
diff --git a/src/packages/avatar/demos/taro/demo1.tsx b/src/packages/avatar/demos/taro/demo1.tsx
index be4dc2076c..f93d413c15 100644
--- a/src/packages/avatar/demos/taro/demo1.tsx
+++ b/src/packages/avatar/demos/taro/demo1.tsx
@@ -2,13 +2,18 @@ import React from 'react'
 import { Avatar, Cell } from '@nutui/nutui-react-taro'
 
 const Demo1 = () => {
+  const styles = { marginRight: 30 }
   return (
     <Cell className="cell-avatar" align="flex-end">
       <Avatar
         size="60"
         src="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png"
+        style={styles}
+      />
+      <Avatar
+        style={styles}
+        src="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png"
       />
-      <Avatar src="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png" />
       <Avatar
         size="32"
         src="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png"
diff --git a/src/packages/avatar/demos/taro/demo2.tsx b/src/packages/avatar/demos/taro/demo2.tsx
index 1a16eec983..b095770fa7 100644
--- a/src/packages/avatar/demos/taro/demo2.tsx
+++ b/src/packages/avatar/demos/taro/demo2.tsx
@@ -3,9 +3,10 @@ import { Avatar, Cell } from '@nutui/nutui-react-taro'
 import { User } from '@nutui/icons-react-taro'
 
 const Demo2 = () => {
+  const styles = { marginRight: 30 }
   return (
     <Cell className="cell-avatar">
-      <Avatar icon={<User />} shape="square" />
+      <Avatar icon={<User />} shape="square" style={styles} />
       <Avatar icon={<User />} shape="round" />
     </Cell>
   )
diff --git a/src/packages/avatar/demos/taro/demo3.tsx b/src/packages/avatar/demos/taro/demo3.tsx
index 6c0f891e8b..e9a10ed72d 100644
--- a/src/packages/avatar/demos/taro/demo3.tsx
+++ b/src/packages/avatar/demos/taro/demo3.tsx
@@ -3,10 +3,14 @@ import { Avatar, Cell } from '@nutui/nutui-react-taro'
 import { User } from '@nutui/icons-react-taro'
 
 const Demo3 = () => {
+  const styles = { marginRight: 30 }
   return (
     <Cell className="cell-avatar">
-      <Avatar src="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png" />
-      <Avatar icon={<User />} />
+      <Avatar
+        style={styles}
+        src="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png"
+      />
+      <Avatar style={styles} icon={<User />} />
       <Avatar>N</Avatar>
     </Cell>
   )
diff --git a/src/packages/avatar/demos/taro/demo4.tsx b/src/packages/avatar/demos/taro/demo4.tsx
index eca54d257c..7ca77375a5 100644
--- a/src/packages/avatar/demos/taro/demo4.tsx
+++ b/src/packages/avatar/demos/taro/demo4.tsx
@@ -4,12 +4,14 @@ import { User } from '@nutui/icons-react-taro'
 import { harmony } from '@/utils/platform-taro'
 
 const Demo4 = () => {
+  const styles = { marginRight: 30 }
   return (
     <Cell className="cell-avatar">
       <Avatar
         color="#ffffff"
         background={`${harmony() ? '#ff0f23' : 'var(--nutui-color-primary)'}`}
         icon={<User />}
+        style={styles}
       />
       <Avatar
         color={`${harmony() ? '#ff0f23' : 'var(--nutui-color-primary)'}`}
diff --git a/src/packages/avatar/demos/taro/demo5.tsx b/src/packages/avatar/demos/taro/demo5.tsx
index 3568f321f4..2c9175fe5a 100644
--- a/src/packages/avatar/demos/taro/demo5.tsx
+++ b/src/packages/avatar/demos/taro/demo5.tsx
@@ -1,22 +1,20 @@
 import React from 'react'
 // import { Avatar, Badge, Cell } from '@nutui/nutui-react-taro'
-import { Avatar, Cell } from '@nutui/nutui-react-taro'
+import { Avatar, Badge, Cell } from '@nutui/nutui-react-taro'
 import { User } from '@nutui/icons-react-taro'
-import { harmony } from '@/utils/platform-taro'
 
 const Demo5 = () => {
+  const styles = { marginRight: 30 }
   return (
     <Cell className="cell-avatar">
-      {harmony() ? null : (
-        <>
-          {/* <Badge value="8"> */}
+      <>
+        <Badge value="8" style={styles}>
           <Avatar icon={<User />} shape="square" />
-          {/* </Badge> */}
-          {/* <Badge dot> */}
+        </Badge>
+        <Badge dot>
           <Avatar icon={<User />} shape="square" />
-          {/* </Badge> */}
-        </>
-      )}
+        </Badge>
+      </>
     </Cell>
   )
 }
diff --git a/src/packages/hoverbutton/demos/taro/demo6.tsx b/src/packages/hoverbutton/demos/taro/demo6.tsx
index 3104f48b84..bcfbf25432 100644
--- a/src/packages/hoverbutton/demos/taro/demo6.tsx
+++ b/src/packages/hoverbutton/demos/taro/demo6.tsx
@@ -4,7 +4,6 @@
 import React from 'react'
 import { HoverButton } from '@nutui/nutui-react-taro'
 import { View } from '@tarojs/components'
-import pxTransform from '@/utils/px-transform'
 
 const Demo1 = () => {
   return (
@@ -42,7 +41,6 @@ const Demo1 = () => {
           <View
             style={{
               fontSize: 10,
-              lineHeight: pxTransform(9),
               fontFamily: 'JD',
             }}
           >
diff --git a/src/packages/swiper/demos/taro/demo5.tsx b/src/packages/swiper/demos/taro/demo5.tsx
index 1bce7d7d6a..a01ad177d8 100644
--- a/src/packages/swiper/demos/taro/demo5.tsx
+++ b/src/packages/swiper/demos/taro/demo5.tsx
@@ -3,7 +3,6 @@ import { Swiper } from '@nutui/nutui-react-taro'
 import { Image, Text, View } from '@tarojs/components'
 import { ArrowLeft, ArrowRight } from '@nutui/icons-react-taro'
 import pxTransform from '@/utils/px-transform'
-import { harmony } from '@/utils/platform-taro'
 
 function Demo5() {
   const swiperRef = React.useRef<any>(null)
@@ -63,10 +62,10 @@ function Demo5() {
       </Swiper>
       <View style={btnsStyle as any}>
         <View style={spanStyle} onClick={(e) => swiperRef.current?.prev()}>
-          {!harmony() ? <ArrowLeft /> : null}
+          <ArrowLeft />
         </View>
         <View style={spanStyle} onClick={(e) => swiperRef.current?.next()}>
-          {!harmony() ? <ArrowRight /> : null}
+          <ArrowRight />
         </View>
       </View>
     </View>

From 6640ec6fa9757579127332b133dabf4c98aed6b8 Mon Sep 17 00:00:00 2001
From: hanyuxinting <hanyuxinting@sina.cn>
Date: Wed, 19 Feb 2025 21:51:51 +0800
Subject: [PATCH 4/4] fix: check harmony adaption

---
 src/packages/avatar/demos/taro/demo5.tsx      | 15 ++++++---------
 src/packages/hoverbutton/demos/taro/demo3.tsx | 17 +++++++----------
 src/packages/hoverbutton/demos/taro/demo5.tsx |  7 ++++---
 src/packages/skeleton/demo.taro.tsx           |  9 ++-------
 src/packages/skeleton/demos/taro/demo4.tsx    |  3 ++-
 src/packages/tabbar/demo.taro.tsx             |  2 +-
 src/packages/tabs/demos/taro/demo22.tsx       |  5 +++--
 src/packages/tabs/tabs.scss                   |  5 +++++
 8 files changed, 30 insertions(+), 33 deletions(-)

diff --git a/src/packages/avatar/demos/taro/demo5.tsx b/src/packages/avatar/demos/taro/demo5.tsx
index 2c9175fe5a..dbfeffe3ea 100644
--- a/src/packages/avatar/demos/taro/demo5.tsx
+++ b/src/packages/avatar/demos/taro/demo5.tsx
@@ -1,5 +1,4 @@
 import React from 'react'
-// import { Avatar, Badge, Cell } from '@nutui/nutui-react-taro'
 import { Avatar, Badge, Cell } from '@nutui/nutui-react-taro'
 import { User } from '@nutui/icons-react-taro'
 
@@ -7,14 +6,12 @@ const Demo5 = () => {
   const styles = { marginRight: 30 }
   return (
     <Cell className="cell-avatar">
-      <>
-        <Badge value="8" style={styles}>
-          <Avatar icon={<User />} shape="square" />
-        </Badge>
-        <Badge dot>
-          <Avatar icon={<User />} shape="square" />
-        </Badge>
-      </>
+      <Badge value="8" style={styles}>
+        <Avatar icon={<User />} shape="square" />
+      </Badge>
+      <Badge dot>
+        <Avatar icon={<User />} shape="square" />
+      </Badge>
     </Cell>
   )
 }
diff --git a/src/packages/hoverbutton/demos/taro/demo3.tsx b/src/packages/hoverbutton/demos/taro/demo3.tsx
index a474f5a9a6..d39e037d33 100644
--- a/src/packages/hoverbutton/demos/taro/demo3.tsx
+++ b/src/packages/hoverbutton/demos/taro/demo3.tsx
@@ -5,21 +5,18 @@ import React from 'react'
 import { HoverButton, Tabbar } from '@nutui/nutui-react-taro'
 import { View } from '@tarojs/components'
 import { Cart, Category, Hi, Home, User } from '@nutui/icons-react-taro'
-import { harmony } from '@/utils/platform-taro'
 
 const Demo3 = () => {
   return (
     <View>
       <HoverButton icon={<Cart />} tabbarHeight={48} />
-      {harmony() ? null : (
-        <Tabbar fixed>
-          <Tabbar.Item title="首页" icon={<Home size={18} />} />
-          <Tabbar.Item title="分类" icon={<Category size={18} />} />
-          <Tabbar.Item title="逛" icon={<Hi size={18} />} />
-          <Tabbar.Item title="购物车" icon={<Cart size={18} />} />
-          <Tabbar.Item title="我的" icon={<User size={18} />} />
-        </Tabbar>
-      )}
+      <Tabbar fixed>
+        <Tabbar.Item title="首页" icon={<Home size={18} />} />
+        <Tabbar.Item title="分类" icon={<Category size={18} />} />
+        <Tabbar.Item title="逛" icon={<Hi size={18} />} />
+        <Tabbar.Item title="购物车" icon={<Cart size={18} />} />
+        <Tabbar.Item title="我的" icon={<User size={18} />} />
+      </Tabbar>
     </View>
   )
 }
diff --git a/src/packages/hoverbutton/demos/taro/demo5.tsx b/src/packages/hoverbutton/demos/taro/demo5.tsx
index c45339bd2f..1323dbb211 100644
--- a/src/packages/hoverbutton/demos/taro/demo5.tsx
+++ b/src/packages/hoverbutton/demos/taro/demo5.tsx
@@ -1,11 +1,12 @@
 import React from 'react'
 import { HoverButton, ConfigProvider } from '@nutui/nutui-react-taro'
 import { Cart } from '@nutui/icons-react-taro'
+import pxTransform from '@/utils/px-transform'
 
 const customSpacing = {
-  nutuiHoverbuttonSpacing: '40px',
-  nutuiHoverbuttonPositionBottom: '100px',
-  nutuiHoverbuttonPositionRight: '50px',
+  nutuiHoverbuttonSpacing: pxTransform(40),
+  nutuiHoverbuttonPositionBottom: pxTransform(100),
+  nutuiHoverbuttonPositionRight: pxTransform(50),
   nutuiHoverbuttonItemBorderColor: '#FA2C19',
   nutuiHoverbuttonItemBackground: '#FFEAE8',
   nutuiHoverbuttonItemBackgroundActive: '#FEC3BE',
diff --git a/src/packages/skeleton/demo.taro.tsx b/src/packages/skeleton/demo.taro.tsx
index fe384b56c7..9f33d74b64 100644
--- a/src/packages/skeleton/demo.taro.tsx
+++ b/src/packages/skeleton/demo.taro.tsx
@@ -9,7 +9,6 @@ import Demo2 from './demos/taro/demo2'
 import Demo3 from './demos/taro/demo3'
 import Demo4 from './demos/taro/demo4'
 import Demo5 from './demos/taro/demo5'
-import { harmony } from '@/utils/platform-taro'
 
 const SkeletonDemo = () => {
   const [translated] = useTranslate({
@@ -46,12 +45,8 @@ const SkeletonDemo = () => {
         <Demo2 />
         <View className="h2">{translated['02a53df5']}</View>
         <Demo3 />
-        {harmony() ? null : (
-          <>
-            <View className="h2">{translated['0a001122']}</View>
-            <Demo4 />
-          </>
-        )}
+        <View className="h2">{translated['0a001122']}</View>
+        <Demo4 />
         <View className="h2">{translated['07d62d5c']}</View>
         <Demo5 />
       </ScrollView>
diff --git a/src/packages/skeleton/demos/taro/demo4.tsx b/src/packages/skeleton/demos/taro/demo4.tsx
index c061b0d2a3..8bf0c9c6e0 100644
--- a/src/packages/skeleton/demos/taro/demo4.tsx
+++ b/src/packages/skeleton/demos/taro/demo4.tsx
@@ -1,12 +1,13 @@
 import React from 'react'
 import { Cell, Skeleton, ConfigProvider } from '@nutui/nutui-react-taro'
+import pxTransform from '@/utils/px-transform'
 
 const Demo4 = () => {
   return (
     <Cell style={{ display: 'block' }}>
       <ConfigProvider
         theme={{
-          nutuiSkeletonLineBorderRadius: '10px',
+          nutuiSkeletonLineBorderRadius: pxTransform(10),
         }}
       >
         <Skeleton rows={3} animated />
diff --git a/src/packages/tabbar/demo.taro.tsx b/src/packages/tabbar/demo.taro.tsx
index e97344a70d..46b8b05d09 100644
--- a/src/packages/tabbar/demo.taro.tsx
+++ b/src/packages/tabbar/demo.taro.tsx
@@ -69,7 +69,7 @@ const TabbarDemo = () => {
         <Demo7 />
         <View className="h2">{translated['8dab2f66']}</View>
         <Demo8 />
-        <View className="h2" style={{ marginBottom: '100px' }}>
+        <View className="h2" style={{ marginBottom: 100 }}>
           {translated.cfbdc781}
         </View>
         <Demo9 />
diff --git a/src/packages/tabs/demos/taro/demo22.tsx b/src/packages/tabs/demos/taro/demo22.tsx
index 88399e432d..48f1babbcf 100644
--- a/src/packages/tabs/demos/taro/demo22.tsx
+++ b/src/packages/tabs/demos/taro/demo22.tsx
@@ -1,5 +1,6 @@
 import React, { useState } from 'react'
 import { Tabs } from '@nutui/nutui-react-taro'
+import pxTransform from '@/utils/px-transform'
 
 // TODO：鸿蒙支持的不好：自定义变量
 const Demo22 = () => {
@@ -11,7 +12,7 @@ const Demo22 = () => {
         onChange={(value) => {
           setTabvalue(value)
         }}
-        style={{ '--nutui-tabs-titles-font-size': '20px' }}
+        style={{ '--nutui-tabs-titles-font-size': pxTransform(20) }}
       >
         <Tabs.TabPane title="Tab longitem"> Tab longitem </Tabs.TabPane>
         <Tabs.TabPane title="Tab 2"> Tab 2 </Tabs.TabPane>
@@ -22,7 +23,7 @@ const Demo22 = () => {
         onChange={(value) => {
           setTabvalue(value)
         }}
-        style={{ '--nutui-tabs-titles-font-size': '12px' }}
+        style={{ '--nutui-tabs-titles-font-size': pxTransform(12) }}
       >
         <Tabs.TabPane title="Tab longitem"> Tab longitem </Tabs.TabPane>
         <Tabs.TabPane title="Tab 2"> Tab 2 </Tabs.TabPane>
diff --git a/src/packages/tabs/tabs.scss b/src/packages/tabs/tabs.scss
index ec7ba1c994..da673c31c4 100644
--- a/src/packages/tabs/tabs.scss
+++ b/src/packages/tabs/tabs.scss
@@ -214,7 +214,12 @@
 .nut-tabs-vertical {
   .nut-tabs-ellipsis {
     white-space: break-spaces;
+    /* #ifdef harmony */
+    padding-left: 12px;
+    /* #endif */
+    /* #ifndef harmony */
     padding-left: 6px;
+    /* #endif */
     width: 90px;
     line-height: $font-size-base;
   }