fix(Table): calc table height incorrect when invisible at first render (

#3980)

* fix: 修复不可见表格高度计算不正确问题

* refactor: 使用动画帧 api

* chore: bump version 8.8.2-beta02

src/BootstrapBlazor/BootstrapBlazor.csproj

@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Razor">
 
  <PropertyGroup>
- <Version>8.8.2-beta01</Version>
+ <Version>8.8.2-beta02</Version>
  </PropertyGroup>
 
  <ItemGroup Condition="'$(TargetFramework)' == 'net5.0'">

src/BootstrapBlazor/Components/Table/Table.razor.js

@@ -190,6 +190,9 @@ export function dispose(id) {
  Data.remove(id)
 
  if (table) {
+ if (table.loopCheckHeightHandler) {
+ cancelAnimationFrame(table.loopCheckHeightHandler);
+ }
  if (table.thead) {
  EventHandler.off(table.body, 'scroll')
  }
@@ -243,13 +246,25 @@ const setColumnToolboxListener = table => {
  }
 }
 
+const check = table => {
+ const el = table.el;
+ if (isVisible(el) === false) {
+ table.loopCheckHeightHandler = requestAnimationFrame(() => check(table));
+ }
+ else {
+ delete table.loopCheckHeightHandler;
+ setBodyHeight(table);
+ }
+};
+
 const setBodyHeight = table => {
  const el = table.el
  const children = [...el.children]
  const search = children.find(i => i.classList.contains('table-search'))
  table.search = search;
 
  if (isVisible(el) === false) {
+ table.loopCheckHeightHandler = requestAnimationFrame(() => check(table));
  return;
  }