From cce84edd8a0c3288b5132905d2c3e5a9bdfa82e2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=88=E6=9D=B0?= <chj_0507_dz@sina.com>
Date: Thu, 14 Dec 2023 11:50:59 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8DListItem=20=E7=9A=84?=
 =?UTF-8?q?=E6=A0=B7=E5=BC=8F=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .changeset/lemon-guests-explain.md            |  5 ++++
 packages/react-native/src/list-item/index.tsx | 30 +++++++++----------
 packages/react-native/src/list/index.tsx      |  4 ++-
 3 files changed, 22 insertions(+), 17 deletions(-)
 create mode 100644 .changeset/lemon-guests-explain.md

diff --git a/.changeset/lemon-guests-explain.md b/.changeset/lemon-guests-explain.md
new file mode 100644
index 0000000000..1ae1c9417b
--- /dev/null
+++ b/.changeset/lemon-guests-explain.md
@@ -0,0 +1,5 @@
+---
+'@td-design/react-native': patch
+---
+
+fix: 修复 list-item 组件的样式问题
diff --git a/packages/react-native/src/list-item/index.tsx b/packages/react-native/src/list-item/index.tsx
index b65b651192..340e229385 100644
--- a/packages/react-native/src/list-item/index.tsx
+++ b/packages/react-native/src/list-item/index.tsx
@@ -166,25 +166,23 @@ const Content = ({
       style={[{ backgroundColor }, style]}
     >
       <Flex>
-        <Box flex={1}>
-          <Flex>
-            <Flex marginRight={'x5'} justifyContent="center" alignItems="center">
-              {required && (
-                <Text variant="p1" color="func600">
-                  *
-                </Text>
-              )}
-              {thumb}
-              {Title}
-            </Flex>
-            <Box flex={1} alignItems="flex-end">
-              {Extra}
-            </Box>
+        <Flex flex={1}>
+          <Flex marginRight={'x5'} justifyContent="center" alignItems="center">
+            {required && (
+              <Text variant="p1" color="func600">
+                *
+              </Text>
+            )}
+            {thumb}
+            {Title}
           </Flex>
-          {!!brief && <Brief wrap={wrap}>{brief}</Brief>}
-        </Box>
+          <Box flex={1} alignItems="flex-end">
+            {Extra}
+          </Box>
+        </Flex>
         {Arrow}
       </Flex>
+      {!!brief && <Brief wrap={wrap}>{brief}</Brief>}
     </Box>
   );
 };
diff --git a/packages/react-native/src/list/index.tsx b/packages/react-native/src/list/index.tsx
index da37fef16a..166417e7f3 100644
--- a/packages/react-native/src/list/index.tsx
+++ b/packages/react-native/src/list/index.tsx
@@ -34,7 +34,9 @@ const List: FC<ListProps> = ({ header, extra, itemBackgroundColor, itemStyle, it
     <Box>
       {Header}
       {items.map((props, index) => {
-        return <ListItem key={index} {...props} backgroundColor={itemBackgroundColor} style={itemStyle} />;
+        return (
+          <ListItem key={index} {...props} backgroundColor={itemBackgroundColor} style={[itemStyle, props.style]} />
+        );
       })}
     </Box>
   );