Collapse折叠动画在React中为什么高度过渡不生效？

开发者雨萓提问于 2026-03-17 09:18:18 阅读 4

组件

我用React写了个Collapse组件，想实现点击展开/收起时的高度平滑过渡，但动画完全没效果，直接闪现。试过加transition和maxHeight，还是不行，是不是哪里逻辑错了？

这是我的代码：

const Collapse = ({ isOpen, children }) => {
  return (
    <div
      style={{
        height: isOpen ? 'auto' : 0,
        overflow: 'hidden',
        transition: 'height 0.3s ease'
      }}
    >
      {children}
    </div>
  );
};

动画组件

我来解答赞 2 收藏

反馈

暂无解答