如何使文本区域适合KeyUp事件上的文本内容

所以我有一个textarea

<textarea>
Very long content. Very long content. Very long content. 
Very long content. Very long content. Very long content. 
Very long content. Very long content. Very long content. 
Very long content. Very long content. Very long content. 
Very long content. Very long content. Very long content. 
Very long content. Very long content. Very long content. 
</textarea>

我想让textarea适合文本区域中的文本，因为用户用下面的代码键入它

const textarea = document.querySelector('textarea')
textarea.addEventListener('keyup', () => {
  textarea.style.height = `${textarea.scrollHeight}px`;
})

当用户向文本区域添加更多文本时，它工作正常。问题是，当用户清除里面的文本并再次开始键入时，文本区域将不会缩小以适合文本。

知道如何解决这个问题吗？