Javascript 自动调整文本区域大小以显示加载的所有文本，而无需在Blazor中滚动

我正在尝试自动调整文本区域的大小，以显示加载的所有文本，而无需在Blazor中滚动

<textarea class="form-control" maxlength="255" style="width:250px;" @bind="Comment" id="Comments" required></textarea>

以下css我使用但不工作

textarea {
  resize: vertical;
  overflow: visible;
  height:auto !important;
}

---

提前感谢。

如果您愿意使用JSInterop，这将起作用：

将JS函数添加到_Host.cshtml：

。。。
ResizeTextArea=函数（id）{
var el=document.getElementById（id）；
如果（el）{
el.style.height=“5px”；
el.style.height=（el.scrollHeight+5）+“px”；
}
返回true；
}

在Blazor组件中，注入

IJSRuntime

，并添加

OnAfterRenderAsync

事件处理程序以调用JS函数：

@page”/interop
@注入IJSRuntime jsRuntime
JSInterop
@代码{
public string Comment=“这是textarea的测试注释。这是textarea的测试注释。”；
AfterRenderAsync（bool firstRender）上受保护的重写异步任务
{
等待jsRuntime.InvokeAsync（“ResizeTextArea”、“Comments”）；
}
}

注意：JS函数取自

textarea {
  resize: vertical;
  overflow: visible;
  height:auto !important;
}