refactor(ModalDialog): update javascript check modal first shown (#4676)

* fix: 增加调整位置前检查

* chore: bump version 9.0.1-beta02

* refactor: 精简代码

Author: ArgoZhang

src/BootstrapBlazor/BootstrapBlazor.csproj

@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
-    <Version>9.0.0-beta03</Version>
+    <Version>9.0.1-beta02</Version>
   </PropertyGroup>
 
   <ItemGroup>

src/BootstrapBlazor/Components/Modal/ModalDialog.razor.js

@@ -121,15 +121,27 @@ export function init(id) {
     }
 
     if (el.classList.contains('is-draggable-center')) {
-        const width = el.offsetWidth / 2;
-        const height = el.offsetHeight / 2;
-
-        el.style.setProperty("margin-left", `calc(50vw - ${width}px)`);
-        el.style.setProperty("margin-top", `calc(50vh - ${height}px)`);
-        el.classList.remove('is-draggable-center');
+        const check = () => {
+            if (el.offsetWidth > 0) {
+                update(el);
+            }
+            else {
+                requestAnimationFrame(check);
+            }
+        }
+        requestAnimationFrame(check);
     }
 }
 
+const update = el => {
+    const width = el.offsetWidth / 2;
+    const height = el.offsetHeight / 2;
+
+    el.style.setProperty("margin-left", `calc(50vw - ${width}px)`);
+    el.style.setProperty("margin-top", `calc(50vh - ${height}px)`);
+    el.classList.remove('is-draggable-center');
+}
+
 export function dispose(id) {
     const dialog = Data.get(id)
     Data.remove(id)