feat: 增加 OnPageChangedAsync 回调方法

Author: ArgoZhang

src/components/BootstrapBlazor.PdfReader/PdfReader.razor.cs

@@ -110,7 +110,8 @@ protected override async Task OnAfterRenderAsync(bool firstRender)
     {
         Options.Url,
         Options.IsFitToPage,
-        TriggerPagesInit = Options.OnInitAsync != null
+        TriggerPagesInit = Options.OnInitAsync != null,
+        TriggerPageChanged = Options.OnPageChangedAsync != null
     });
 
     /// <summary>
@@ -168,8 +169,14 @@ public async Task PagesInit(int pagesCount)
     /// </summary>
     /// <returns></returns>
     [JSInvokable]
-    public Task PageChanging()
+    public async Task PageChanged(uint pageIndex)
     {
-        return Task.CompletedTask;
+        _currentPage = pageIndex;
+        Options.CurrentPage = pageIndex;
+
+        if (Options.OnPageChangedAsync != null)
+        {
+            await Options.OnPageChangedAsync(pageIndex);
+        }
     }
 }

src/components/BootstrapBlazor.PdfReader/PdfReader.razor.js

@@ -103,23 +103,18 @@ const addEventListener = (pdfViewer, eventBus, invoke, options) => {
         }
     });
 
-    eventBus.on("documentloaded", e => {
-        console.log(e);
-    });
+    eventBus.on("pagechanging", async evt => {
+        const page = evt.pageNumber;
+        const el = evt.source.container.parentElement;
+        const pageNumberEl = el.querySelector(".bb-view-num");
+        if (pageNumberEl) {
+            pageNumberEl.value = page;
+        }
 
-    eventBus.on(
-        "pagechanging",
-        function (evt) {
-            const page = evt.pageNumber;
-            console.log(page);
-            //const numPages = PDFViewerApplication.pagesCount;
-
-            //document.getElementById("pageNumber").value = page;
-            //document.getElementById("previous").disabled = page <= 1;
-            //document.getElementById("next").disabled = page >= numPages;
-        },
-        true
-    );
+        if (options.triggerPageChanged === true) {
+            await invoke.invokeMethodAsync("pageChanged", page);
+        }
+    }, true);
 }
 
 function getCanvas(item) {

src/components/BootstrapBlazor.PdfReader/PdfReaderOptions.cs

@@ -38,4 +38,9 @@ public class PdfReaderOptions
     /// 页面初始化回调方法
     /// </summary>
     public Func<int, Task>? OnInitAsync { get; set; }
+
+    /// <summary>
+    /// 页面初始化回调方法
+    /// </summary>
+    public Func<uint, Task>? OnPageChangedAsync { get; set; }
 }