From 86a6e29d8726311e430869588a1c26426e09b8f2 Mon Sep 17 00:00:00 2001 From: oasis Date: Tue, 1 Apr 2025 12:04:00 +0800 Subject: [PATCH 1/6] =?UTF-8?q?feat(collapse):=20=E9=80=82=E9=85=8D?= =?UTF-8?q?=E9=B8=BF=E8=92=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/config.json | 14 +- src/packages/collapseitem/collapseitem.scss | 25 +++- .../collapseitem/collapseitem.taro.tsx | 127 +++++++----------- src/packages/collapseitem/collapseitem.tsx | 98 ++++++++------ 4 files changed, 137 insertions(+), 127 deletions(-) diff --git a/src/config.json b/src/config.json index 792fd0f5a0..7cb04916e9 100644 --- a/src/config.json +++ b/src/config.json @@ -1127,7 +1127,7 @@ "dd": false }, { - "version": "2.0.0", + "version": "3.0.0", "name": "Collapse", "type": "component", "cName": "折叠面板", @@ -1135,12 +1135,12 @@ "sort": 2, "show": true, "taro": true, - "v15": -1, - "author": "zhenyulei", - "dd": false + "v15": 1, + "author": "oasis", + "dd": true }, { - "version": "2.0.0", + "version": "3.0.0", "name": "CollapseItem", "type": "component", "cName": "折叠面板子组件", @@ -1148,8 +1148,8 @@ "sort": 13, "show": false, "exportEmpty": true, - "author": "zhenyulei", - "dd": false + "author": "oasis", + "dd": true }, { "version": "3.0.0", diff --git a/src/packages/collapseitem/collapseitem.scss b/src/packages/collapseitem/collapseitem.scss index c3b8a31c60..2a27db9cd0 100644 --- a/src/packages/collapseitem/collapseitem.scss +++ b/src/packages/collapseitem/collapseitem.scss @@ -38,8 +38,12 @@ left: 16px; bottom: 0; border-bottom: $collapse-item-header-border-bottom; - -webkit-transform: scaleY(0.5); - transform: scaleY(0.5); + /* #ifdef harmony */ + transform: scale(1, 1); + /* #endif */ + /* #ifndef harmony */ + transform: scale(1, 0.5); + /* #endif */ } } @@ -90,14 +94,26 @@ } } - &-content { + &-content-wrapper { + width: 100%; + position: relative; + box-sizing: border-box; overflow: hidden; + &-tran { + transition: all 0.3s linear; + } + } + + &-content { display: block; + position: absolute; + height: auto; + width: 100%; + box-sizing: border-box; color: $collapse-wrapper-content-color; font-size: $collapse-wrapper-content-font-size; line-height: $collapse-wrapper-content-line-height; background-color: $collapse-wrapper-content-background-color; - transition: all 0.3s linear; &-text { color: $collapse-wrapper-content-color; @@ -105,6 +121,7 @@ } } } + [dir='rtl'] .nut-collapse-item, .nut-rtl .nut-collapse-item { &-icon { diff --git a/src/packages/collapseitem/collapseitem.taro.tsx b/src/packages/collapseitem/collapseitem.taro.tsx index be8fa23170..c4fa30a52d 100644 --- a/src/packages/collapseitem/collapseitem.taro.tsx +++ b/src/packages/collapseitem/collapseitem.taro.tsx @@ -1,17 +1,20 @@ import React, { FunctionComponent, - useEffect, - useState, ReactNode, useContext, - useRef, + useEffect, useMemo, + useRef, + useState, } from 'react' import { View } from '@tarojs/components' import classNames from 'classnames' -import { createSelectorQuery } from '@tarojs/taro' +import { nextTick } from '@tarojs/taro' import { BasicComponent, ComponentDefaults } from '@/utils/typings' import CollapseContext from '../collapse/context' +import { getRectByTaro } from '@/utils/get-rect-by-taro' +import useUuid from '@/hooks/use-uuid' +import { useRefState } from '@/hooks/use-ref-state' export interface CollapseItemProps extends BasicComponent { title: ReactNode @@ -54,8 +57,8 @@ export const CollapseItem: FunctionComponent< const context = useContext(CollapseContext) const wrapperRef: any = useRef(null) const contentRef: any = useRef(null) - const [refRandomId] = useState(() => Math.random().toString(36).slice(-8)) - const target = `#nut-collapse-content-${refRandomId}` + const uid = useUuid() + const target = `nut-collapse-content-${uid}` const expanded = useMemo(() => { if (context) { @@ -63,6 +66,7 @@ export const CollapseItem: FunctionComponent< } return false }, [name, context.isOpen]) + console.log('oasis', expanded, name) const iconStyle = useMemo(() => { return expanded @@ -70,81 +74,52 @@ export const CollapseItem: FunctionComponent< : { transform: 'translateY(-50%)' } }, [expanded, rotate]) - const handleClick = () => { - if (!disabled) { - context.updateValue(name) - } - } - - const [timer, setTimer] = useState(null) - const [currentHeight, setCurrentHeight] = useState('auto') + const timer = useRef(null) const inAnimation = useRef(false) - const [wrapperHeight, setWrapperHeight] = useState(() => - expanded ? 'auto' : '0px' - ) + const [tran, setTran] = useState(0) + const [currentHeight, setCurrentHeight] = useRefState(0) + const [wrapperHeight, setWrapperHeight] = useState(0) - const getRect = (selector: string) => { - return new Promise((resolve) => { - createSelectorQuery() - .select(selector) - .boundingClientRect() - .exec((rect = []) => { - resolve(rect[0]) + const updateRectHeight = async () => { + nextTick(async () => { + const res = await getRectByTaro(contentRef.current, target) + console.log('oasis res', res.height) + if (res?.height) { + setCurrentHeight(res.height) + setWrapperHeight(expanded ? res.height : 0) + setTimeout(() => { + setTran(1) }) + } }) } - useEffect(() => { - setTimeout(() => { - getRect(target).then((res: any) => { - if (res?.height) { - setCurrentHeight(`${res.height}px`) - } - }) - }, 200) - }, [children]) - - useEffect(() => { - setTimeout(() => { - getRect(target).then((res: any) => { - if (res?.height) { - setCurrentHeight(`${res.height}px`) - } - }) - }, 100) - }, []) + nextTick(() => { + console.log('oasis update', name) + updateRectHeight() + }) + }, [children, expanded]) const toggle = () => { // 连续切换状态时，清除打开的后续操作 - if (timer) { - clearTimeout(timer) - setTimer(timer) + if (timer.current) { + clearTimeout(timer.current) } - const start = expanded ? '0px' : currentHeight - const end = expanded ? currentHeight : '0px' inAnimation.current = true - setWrapperHeight(start) + const end = !expanded ? currentHeight.current : 0 + console.log('oasis end', expanded, end) setTimeout(() => { setWrapperHeight(end) inAnimation.current = false - if (expanded) { - const timer = setTimeout(() => { - setWrapperHeight('auto') - }, 300) - setTimer(timer) - } - }, 100) + }, 0) } - - const init = useRef(true) - - useEffect(() => { - if (init.current) { - init.current = false - } else { + const handleClick = () => { + if (!disabled) { + console.log('oasis name', name) + context.updateValue(name) toggle() } - }, [expanded]) + } return (
@@ -161,19 +136,21 @@ export const CollapseItem: FunctionComponent< - - {children} + + {children}
diff --git a/src/packages/collapseitem/collapseitem.tsx b/src/packages/collapseitem/collapseitem.tsx index 672e5e0055..336985d38c 100644 --- a/src/packages/collapseitem/collapseitem.tsx +++ b/src/packages/collapseitem/collapseitem.tsx @@ -1,14 +1,16 @@ import React, { FunctionComponent, - useEffect, ReactNode, useContext, - useRef, + useEffect, useMemo, + useRef, + useState, } from 'react' import classNames from 'classnames' import { BasicComponent, ComponentDefaults } from '@/utils/typings' import CollapseContext from '../collapse/context' +import { useRefState } from '@/hooks/use-ref-state' export interface CollapseItemProps extends BasicComponent { title: ReactNode @@ -58,6 +60,7 @@ export const CollapseItem: FunctionComponent< } return false }, [name, context.isOpen]) + console.log('oasis', expanded, name) const iconStyle = useMemo(() => { return expanded @@ -65,51 +68,53 @@ export const CollapseItem: FunctionComponent< : { transform: 'translateY(-50%)' } }, [expanded, rotate]) - const handleClick = () => { - if (!disabled) { - context.updateValue(name) - } - } + const timer = useRef(null) + const inAnimation = useRef(false) + const [tran, setTran] = useState(0) + const [currentHeight, setCurrentHeight] = useRefState(0) + const [wrapperHeight, setWrapperHeight] = useState(0) - const onTransitionEnd = () => { - if (expanded) { - if (wrapperRef.current) { - wrapperRef.current.style.height = '' + const updateRectHeight = async () => { + setTimeout(async () => { + const height = contentRef.current.offsetHeight + console.log('oasis res', height) + if (height) { + setCurrentHeight(height) + setWrapperHeight(expanded ? height : 0) + setTimeout(() => { + setTran(1) + }) } - } + }) } - const getOffsetHeight = () => { - const height = contentRef.current?.offsetHeight - return height ? `${height}px` : '' - } + useEffect(() => { + setTimeout(() => { + console.log('oasis update', name) + updateRectHeight() + }) + }, [children, expanded]) const toggle = () => { - const start = expanded ? '0px' : getOffsetHeight() - if (wrapperRef.current) { - wrapperRef.current.style.height = start + // 连续切换状态时，清除打开的后续操作 + if (timer.current) { + clearTimeout(timer.current) } - requestAnimationFrame(() => { - requestAnimationFrame(() => { - const end = expanded ? getOffsetHeight() : '0px' - if (wrapperRef.current) { - wrapperRef.current.style.height = end - } - }) - }) + inAnimation.current = true + const end = !expanded ? currentHeight.current : 0 + console.log('oasis end', expanded, end) + setTimeout(() => { + setWrapperHeight(end) + inAnimation.current = false + }, 0) } - const init = useRef(true) - - useEffect(() => { - if (init.current) { - init.current = false - if (!expanded) { - wrapperRef.current.style.height = '0px' - } - } else { + const handleClick = () => { + if (!disabled) { + console.log('oasis name', name) + context.updateValue(name) toggle() } - }, [expanded]) + } return (
@@ -126,12 +131,23 @@ export const CollapseItem: FunctionComponent<
-
- {children} +
+
+ {children} +
From aa6d8862bfe7de907059ec739a9c1febc529c97e Mon Sep 17 00:00:00 2001 From: oasis Date: Tue, 1 Apr 2025 12:22:59 +0800 Subject: [PATCH 2/6] =?UTF-8?q?feat(collapse):=20=E9=80=82=E9=85=8D?= =?UTF-8?q?=E9=B8=BF=E8=92=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/packages/collapseitem/collapseitem.taro.tsx | 17 ++++------------- src/packages/collapseitem/collapseitem.tsx | 13 +------------ 2 files changed, 5 insertions(+), 25 deletions(-) diff --git a/src/packages/collapseitem/collapseitem.taro.tsx b/src/packages/collapseitem/collapseitem.taro.tsx index c4fa30a52d..f704ed60bb 100644 --- a/src/packages/collapseitem/collapseitem.taro.tsx +++ b/src/packages/collapseitem/collapseitem.taro.tsx @@ -74,8 +74,6 @@ export const CollapseItem: FunctionComponent< : { transform: 'translateY(-50%)' } }, [expanded, rotate]) - const timer = useRef(null) - const inAnimation = useRef(false) const [tran, setTran] = useState(0) const [currentHeight, setCurrentHeight] = useRefState(0) const [wrapperHeight, setWrapperHeight] = useState(0) @@ -101,23 +99,16 @@ export const CollapseItem: FunctionComponent< }, [children, expanded]) const toggle = () => { - // 连续切换状态时，清除打开的后续操作 - if (timer.current) { - clearTimeout(timer.current) - } - inAnimation.current = true const end = !expanded ? currentHeight.current : 0 - console.log('oasis end', expanded, end) - setTimeout(() => { - setWrapperHeight(end) - inAnimation.current = false - }, 0) + setWrapperHeight(end) } const handleClick = () => { if (!disabled) { console.log('oasis name', name) context.updateValue(name) - toggle() + nextTick(() => { + toggle() + }) } } diff --git a/src/packages/collapseitem/collapseitem.tsx b/src/packages/collapseitem/collapseitem.tsx index 336985d38c..45fad70461 100644 --- a/src/packages/collapseitem/collapseitem.tsx +++ b/src/packages/collapseitem/collapseitem.tsx @@ -68,8 +68,6 @@ export const CollapseItem: FunctionComponent< : { transform: 'translateY(-50%)' } }, [expanded, rotate]) - const timer = useRef(null) - const inAnimation = useRef(false) const [tran, setTran] = useState(0) const [currentHeight, setCurrentHeight] = useRefState(0) const [wrapperHeight, setWrapperHeight] = useState(0) @@ -96,17 +94,8 @@ export const CollapseItem: FunctionComponent< }, [children, expanded]) const toggle = () => { - // 连续切换状态时，清除打开的后续操作 - if (timer.current) { - clearTimeout(timer.current) - } - inAnimation.current = true const end = !expanded ? currentHeight.current : 0 - console.log('oasis end', expanded, end) - setTimeout(() => { - setWrapperHeight(end) - inAnimation.current = false - }, 0) + setWrapperHeight(end) } const handleClick = () => { if (!disabled) { From f1f2cb00a85f8a9781f212b76d2f648038b1dedf Mon Sep 17 00:00:00 2001 From: oasis Date: Tue, 1 Apr 2025 14:42:06 +0800 Subject: [PATCH 3/6] =?UTF-8?q?feat(collapse):=20=E9=80=82=E9=85=8D?= =?UTF-8?q?=E9=B8=BF=E8=92=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../__snapshots__/collapse.spec.tsx.snap | 33 ++++++++++++------- .../collapse/__test__/collapse.spec.tsx | 11 ++++--- src/packages/collapseitem/collapseitem.scss | 2 +- .../collapseitem/collapseitem.taro.tsx | 4 ++- src/packages/collapseitem/collapseitem.tsx | 29 ++++++++-------- 5 files changed, 46 insertions(+), 33 deletions(-) diff --git a/src/packages/collapse/__test__/__snapshots__/collapse.spec.tsx.snap b/src/packages/collapse/__test__/__snapshots__/collapse.spec.tsx.snap index 75e2bb6729..0eb362ae53 100644 --- a/src/packages/collapse/__test__/__snapshots__/collapse.spec.tsx.snap +++ b/src/packages/collapse/__test__/__snapshots__/collapse.spec.tsx.snap @@ -42,12 +42,16 @@ exports[`should match snapshot 1`] = `
- 京东“厂直优品计划”首推“政府优品馆” 3年覆盖80%镇级政府 +
+ 京东“厂直优品计划”首推“政府优品馆” 3年覆盖80%镇级政府 +
@@ -88,12 +92,16 @@ exports[`should match snapshot 1`] = `
- 京东“厂直优品计划”首推“政府优品馆” 3年覆盖80%镇级政府 +
+ 京东“厂直优品计划”首推“政府优品馆” 3年覆盖80%镇级政府 +
@@ -101,7 +109,7 @@ exports[`should match snapshot 1`] = ` class="nut-collapse-item" >
- 京东“厂直优品计划”首推“政府优品馆” +
+ 京东“厂直优品计划”首推“政府优品馆” +
diff --git a/src/packages/collapse/__test__/collapse.spec.tsx b/src/packages/collapse/__test__/collapse.spec.tsx index 8cbcbd4f13..27717f29c5 100644 --- a/src/packages/collapse/__test__/collapse.spec.tsx +++ b/src/packages/collapse/__test__/collapse.spec.tsx @@ -63,10 +63,13 @@ test('prop activeName', async () => { ) - - expect( - container.querySelectorAll('.nut-collapse-item-content')[2] - ).toHaveStyle('height:0px') + waitFor(() => { + expect( + container.querySelectorAll('.nut-collapse-item-content-wrapper')[2] + ).toHaveStyle({ + height: '0', + }) + }) }) test('prop rotate', async () => { diff --git a/src/packages/collapseitem/collapseitem.scss b/src/packages/collapseitem/collapseitem.scss index 2a27db9cd0..6a2e1fa134 100644 --- a/src/packages/collapseitem/collapseitem.scss +++ b/src/packages/collapseitem/collapseitem.scss @@ -82,7 +82,7 @@ transition: transform 0.3s; } - &-header.disabled { + &-header-disabled { color: $collapse-item-disabled-color; .nut-collapse-item-title { diff --git a/src/packages/collapseitem/collapseitem.taro.tsx b/src/packages/collapseitem/collapseitem.taro.tsx index f704ed60bb..01d088553d 100644 --- a/src/packages/collapseitem/collapseitem.taro.tsx +++ b/src/packages/collapseitem/collapseitem.taro.tsx @@ -115,7 +115,9 @@ export const CollapseItem: FunctionComponent< return (
{title} diff --git a/src/packages/collapseitem/collapseitem.tsx b/src/packages/collapseitem/collapseitem.tsx index 45fad70461..b8509a7f41 100644 --- a/src/packages/collapseitem/collapseitem.tsx +++ b/src/packages/collapseitem/collapseitem.tsx @@ -73,24 +73,19 @@ export const CollapseItem: FunctionComponent< const [wrapperHeight, setWrapperHeight] = useState(0) const updateRectHeight = async () => { - setTimeout(async () => { - const height = contentRef.current.offsetHeight - console.log('oasis res', height) - if (height) { - setCurrentHeight(height) - setWrapperHeight(expanded ? height : 0) - setTimeout(() => { - setTran(1) - }) - } - }) + const height = contentRef.current.offsetHeight + console.log('oasis res', height) + if (height) { + setCurrentHeight(height) + setWrapperHeight(expanded ? height : 0) + setTimeout(() => { + setTran(1) + }) + } } useEffect(() => { - setTimeout(() => { - console.log('oasis update', name) - updateRectHeight() - }) + updateRectHeight() }, [children, expanded]) const toggle = () => { @@ -108,7 +103,9 @@ export const CollapseItem: FunctionComponent< return (
{title}
From 91fdf3794e03aa2f3ac1d4a04779a4dd461ddfbb Mon Sep 17 00:00:00 2001 From: oasis Date: Tue, 1 Apr 2025 17:01:30 +0800 Subject: [PATCH 4/6] =?UTF-8?q?feat(collapse):=20=E9=80=82=E9=85=8D?= =?UTF-8?q?=E9=B8=BF=E8=92=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/packages/collapseitem/collapseitem.taro.tsx | 1 + src/utils/get-rect-by-taro.ts | 1 + 2 files changed, 2 insertions(+) diff --git a/src/packages/collapseitem/collapseitem.taro.tsx b/src/packages/collapseitem/collapseitem.taro.tsx index 01d088553d..45acf7d7bf 100644 --- a/src/packages/collapseitem/collapseitem.taro.tsx +++ b/src/packages/collapseitem/collapseitem.taro.tsx @@ -59,6 +59,7 @@ export const CollapseItem: FunctionComponent< const contentRef: any = useRef(null) const uid = useUuid() const target = `nut-collapse-content-${uid}` + console.log('oasistarget', target) const expanded = useMemo(() => { if (context) { diff --git a/src/utils/get-rect-by-taro.ts b/src/utils/get-rect-by-taro.ts index 075b737b35..5fb1a50b26 100644 --- a/src/utils/get-rect-by-taro.ts +++ b/src/utils/get-rect-by-taro.ts @@ -34,6 +34,7 @@ export const getRectByTaro = async ( // 小程序下的逻辑 return new Promise((resolve, reject) => { createSelectorQuery() + .in(element) .select(`#${harmonyId || element.uid}`) .boundingClientRect() .exec(([rects]) => { From 2fc1a5511de9ec009c2a396685d201a9be247ee0 Mon Sep 17 00:00:00 2001 From: oasis Date: Wed, 2 Apr 2025 11:58:13 +0800 Subject: [PATCH 5/6] =?UTF-8?q?feat(collapse):=20=E9=80=82=E9=85=8D?= =?UTF-8?q?=E9=B8=BF=E8=92=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../collapseitem/collapseitem.taro.tsx | 27 +++++++------------ src/packages/collapseitem/collapseitem.tsx | 3 --- src/utils/get-rect-by-taro.ts | 1 - 3 files changed, 10 insertions(+), 21 deletions(-) diff --git a/src/packages/collapseitem/collapseitem.taro.tsx b/src/packages/collapseitem/collapseitem.taro.tsx index 45acf7d7bf..ab9a90f263 100644 --- a/src/packages/collapseitem/collapseitem.taro.tsx +++ b/src/packages/collapseitem/collapseitem.taro.tsx @@ -59,7 +59,6 @@ export const CollapseItem: FunctionComponent< const contentRef: any = useRef(null) const uid = useUuid() const target = `nut-collapse-content-${uid}` - console.log('oasistarget', target) const expanded = useMemo(() => { if (context) { @@ -67,7 +66,6 @@ export const CollapseItem: FunctionComponent< } return false }, [name, context.isOpen]) - console.log('oasis', expanded, name) const iconStyle = useMemo(() => { return expanded @@ -80,21 +78,17 @@ export const CollapseItem: FunctionComponent< const [wrapperHeight, setWrapperHeight] = useState(0) const updateRectHeight = async () => { - nextTick(async () => { - const res = await getRectByTaro(contentRef.current, target) - console.log('oasis res', res.height) - if (res?.height) { - setCurrentHeight(res.height) - setWrapperHeight(expanded ? res.height : 0) - setTimeout(() => { - setTran(1) - }) - } - }) + const res = await getRectByTaro(contentRef.current, target) + if (res?.height) { + setCurrentHeight(res.height) + setWrapperHeight(expanded ? res.height : 0) + nextTick(() => { + setTran(1) + }) + } } useEffect(() => { nextTick(() => { - console.log('oasis update', name) updateRectHeight() }) }, [children, expanded]) @@ -105,11 +99,10 @@ export const CollapseItem: FunctionComponent< } const handleClick = () => { if (!disabled) { - console.log('oasis name', name) context.updateValue(name) - nextTick(() => { + setTimeout(() => { toggle() - }) + }, 150) } } diff --git a/src/packages/collapseitem/collapseitem.tsx b/src/packages/collapseitem/collapseitem.tsx index b8509a7f41..a02db9a54d 100644 --- a/src/packages/collapseitem/collapseitem.tsx +++ b/src/packages/collapseitem/collapseitem.tsx @@ -60,7 +60,6 @@ export const CollapseItem: FunctionComponent< } return false }, [name, context.isOpen]) - console.log('oasis', expanded, name) const iconStyle = useMemo(() => { return expanded @@ -74,7 +73,6 @@ export const CollapseItem: FunctionComponent< const updateRectHeight = async () => { const height = contentRef.current.offsetHeight - console.log('oasis res', height) if (height) { setCurrentHeight(height) setWrapperHeight(expanded ? height : 0) @@ -94,7 +92,6 @@ export const CollapseItem: FunctionComponent< } const handleClick = () => { if (!disabled) { - console.log('oasis name', name) context.updateValue(name) toggle() } diff --git a/src/utils/get-rect-by-taro.ts b/src/utils/get-rect-by-taro.ts index 5fb1a50b26..075b737b35 100644 --- a/src/utils/get-rect-by-taro.ts +++ b/src/utils/get-rect-by-taro.ts @@ -34,7 +34,6 @@ export const getRectByTaro = async ( // 小程序下的逻辑 return new Promise((resolve, reject) => { createSelectorQuery() - .in(element) .select(`#${harmonyId || element.uid}`) .boundingClientRect() .exec(([rects]) => { From a0260d70d5f1c99c4d354c1472c0556ded7211fc Mon Sep 17 00:00:00 2001 From: oasis Date: Wed, 2 Apr 2025 13:37:38 +0800 Subject: [PATCH 6/6] =?UTF-8?q?feat(collapse):=20=E9=80=82=E9=85=8D?= =?UTF-8?q?=E9=B8=BF=E8=92=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/packages/collapseitem/collapseitem.tsx | 12 +++++------- 1 file changed, 5 insertions(+), 7 deletions(-) diff --git a/src/packages/collapseitem/collapseitem.tsx b/src/packages/collapseitem/collapseitem.tsx index a02db9a54d..556835eeb4 100644 --- a/src/packages/collapseitem/collapseitem.tsx +++ b/src/packages/collapseitem/collapseitem.tsx @@ -73,13 +73,11 @@ export const CollapseItem: FunctionComponent< const updateRectHeight = async () => { const height = contentRef.current.offsetHeight - if (height) { - setCurrentHeight(height) - setWrapperHeight(expanded ? height : 0) - setTimeout(() => { - setTran(1) - }) - } + setCurrentHeight(height) + setWrapperHeight(expanded ? height : 0) + setTimeout(() => { + setTran(1) + }) } useEffect(() => {