动态更新div高度

问题描述

我正在尝试制作手风琴。因此，当我单击标题时，下面的底部/文本将出现过渡。不幸的是，过渡无法用于height: auto，如果我放置max-height，过渡通常会很奇怪，这取决于容器的真实大小。

我曾经尝试过使用这种JS：

<article [ngClass]="accordionOne ? 'is-active' : ''">
    <h3 (click)="accordionOne=!accordionOne">Accordion One</h3>
    <p #accordionOneText [ngStyle]="accordionOneText ? {'max-height.px': accordionOneText.offsetHeight} : {'max-height.px': 0}">
        Lorem ipsum...
    </p>
</article>

像这样的CSS：

article {

    &.is-active {

        p {
            transition: all 0.2s ease-in;
            overflow: visible;
            opacity: 1;
        }
    }
            
    p {
        opacity: 0;
        transition: all 0.2s ease-in;                   
        overflow: hidden;
    }
}

但是，当我执行此操作时，如果窗口或某些内容发生更改，offsetHeight不会重新计算，即它没有响应。如何解决这个问题？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

angular height