How to animate height , when element heght is not fixed

Such as, We need an collapse component. An collapse has some panel, every panel has a header element.

When header clicked, then panel open or close. The panel open need animate panel heigth for zero to panel's scrollHeight. Close action reverse.

The problem is, I can only get the hight(el.scrollHeight) of panel after the panel render. React-motion require the endState height, before the panel render.