diff --git a/src/packages/__VUE/collapseitem/collapse-item.taro.vue b/src/packages/__VUE/collapseitem/collapse-item.taro.vue
index b9cab7f51f..eee697949d 100644
--- a/src/packages/__VUE/collapseitem/collapse-item.taro.vue
+++ b/src/packages/__VUE/collapseitem/collapse-item.taro.vue
@@ -26,7 +26,7 @@
       </view>
     </view>
 
-    <view v-if="$slots.extra" class="nut-collapse__item-extraWrapper">
+    <view v-if="$slots.extra" class="nut-collapse__item-extraWrapper" :class="{ transition: transition }">
       <div class="nut-collapse__item-extraWrapper__extraRender">
         <slot name="extra"></slot>
       </div>
@@ -34,6 +34,7 @@
     <view
       ref="wrapperRef"
       class="nut-collapse__item-wrapper"
+      :class="{ transition: transition }"
       :style="{
         willChange: 'height',
         height: wrapperHeight
@@ -65,6 +66,7 @@ export type CollapseItemProps = Partial<{
   border: boolean
   icon: any
   rotate: string | number
+  transition: boolean
 }>
 
 const props = withDefaults(defineProps<CollapseItemProps>(), {
@@ -75,7 +77,8 @@ const props = withDefaults(defineProps<CollapseItemProps>(), {
   name: -1,
   border: true,
   icon: () => DownArrow,
-  rotate: 180
+  rotate: 180,
+  transition: true
 })
 
 const slots = useSlots()
@@ -136,7 +139,8 @@ const expanded = computed(() => {
   return false
 })
 
-const wrapperHeight = ref(expanded.value ? 'auto' : '0px')
+const initial = 'initial'
+const wrapperHeight = ref(expanded.value ? initial : '0px')
 
 const handleClick = () => {
   if (!inAnimation.value) {
@@ -150,8 +154,8 @@ const toggle = (open: boolean) => {
     clearTimeout(timeoutId.value)
     timeoutId.value = ''
   }
-  const start = open ? '0px' : currentHeight.value
-  const end = open ? currentHeight.value : '0px'
+  const start = open ? '0px' : initial
+  const end = open ? initial : '0px'
   inAnimation.value = true
   wrapperHeight.value = start
   setTimeout(() => {
@@ -159,7 +163,7 @@ const toggle = (open: boolean) => {
     inAnimation.value = false
     if (open) {
       timeoutId.value = setTimeout(() => {
-        wrapperHeight.value = 'auto'
+        wrapperHeight.value = initial
       }, 300)
     }
   }, 100)
diff --git a/src/packages/__VUE/collapseitem/collapse-item.vue b/src/packages/__VUE/collapseitem/collapse-item.vue
index 4198e4f7a6..5e4c071f0f 100644
--- a/src/packages/__VUE/collapseitem/collapse-item.vue
+++ b/src/packages/__VUE/collapseitem/collapse-item.vue
@@ -23,7 +23,7 @@
       </view>
     </view>
 
-    <view v-if="$slots.extra" class="nut-collapse__item-extraWrapper">
+    <view v-if="$slots.extra" class="nut-collapse__item-extraWrapper" :class="{ transition: transition }">
       <div class="nut-collapse__item-extraWrapper__extraRender">
         <slot name="extra"></slot>
       </div>
@@ -31,6 +31,7 @@
     <view
       ref="wrapperRef"
       class="nut-collapse__item-wrapper"
+      :class="{ transition: transition }"
       :style="{
         willChange: 'height',
         height: wrapperHeight
@@ -62,6 +63,7 @@ export type CollapseItemProps = Partial<{
   border: boolean
   icon: any
   rotate: string | number
+  transition: boolean
 }>
 
 const props = withDefaults(defineProps<CollapseItemProps>(), {
@@ -72,7 +74,8 @@ const props = withDefaults(defineProps<CollapseItemProps>(), {
   name: -1,
   border: true,
   icon: () => DownArrow,
-  rotate: 180
+  rotate: 180,
+  transition: true
 })
 
 // 获取 DOM 元素
diff --git a/src/packages/__VUE/collapseitem/index.scss b/src/packages/__VUE/collapseitem/index.scss
index 051b7d7051..1e44935355 100644
--- a/src/packages/__VUE/collapseitem/index.scss
+++ b/src/packages/__VUE/collapseitem/index.scss
@@ -91,7 +91,9 @@
     position: relative;
     height: 0;
     overflow: hidden;
-    transition: height 0.3s ease-in-out;
+    &.transition {
+      transition: height 0.3s ease-in-out;
+    }
     .nut-collapse__item-wrapper__content,
     .nut-collapse__item-extraWrapper__extraRender {
       display: block;