feat: 增加 OnCompleteAsync 方法

Author: ArgoZhang

src/BootstrapBlazor/Components/Typed/Typed.razor.cs

@@ -22,6 +22,12 @@ public partial class Typed
     [Parameter]
     public TypedOptions? Options { get; set; }
 
+    /// <summary>
+    /// 获得/设置 打字结束回调方法 默认 null
+    /// </summary>
+    [Parameter]
+    public Func<Task>? OnCompleteAsync { get; set; }
+
     private string? _lastOptions;
 
     private string? _text;
@@ -52,27 +58,20 @@ protected override async Task OnAfterRenderAsync(bool firstRender)
     /// <returns></returns>
     protected override Task InvokeInitAsync() => InvokeVoidAsync("init", Id, Interop, Text, Options, new
     {
-        TriggerStop = nameof(TriggerStop)
+        TriggerComplete = nameof(TriggerComplete)
     });
 
     /// <summary>
-    /// 
+    /// 打字结束方法 由 Javascript 触发
     /// </summary>
     /// <returns></returns>
     [JSInvokable]
-    public Task TriggerStart()
+    public async Task TriggerComplete()
     {
-        return Task.CompletedTask;
-    }
-
-    /// <summary>
-    /// 
-    /// </summary>
-    /// <returns></returns>
-    [JSInvokable]
-    public Task TriggerStop()
-    {
-        return Task.CompletedTask;
+        if (OnCompleteAsync != null)
+        {
+            await OnCompleteAsync();
+        }
     }
 
     private bool UpdateParameters()

src/BootstrapBlazor/Components/Typed/Typed.razor.js

@@ -1,34 +1,38 @@
 import Data from "../../modules/data.js"
 import Typed from '../../lib/typedjs/typed.module.js'
 
-export function init(id, invoke, text, options, callbacks) {
-    const el = document.getElementById(id);
+const getOptions = (text, invoke, options, callbacks) => {
     options ??= {};
+
     if (text) {
         options.strings = [text];
     }
     if (options.strings === void 0) {
         options.strings = [""];
     }
+    options.onComplete = function () {
+        if (options.loop) {
+            return;
+        }
+        invoke.invokeMethodAsync(callbacks.triggerComplete);
+    }
+    return options;
+}
 
-    const typed = new Typed(el, options);
+export function init(id, invoke, text, options, callbacks) {
+    const el = document.getElementById(id);
+    const typed = new Typed(el, getOptions(text, invoke, options, callbacks));
     Data.set(id, { el, invoke, callbacks, typed });
 }
 
 export function update(id, text, options) {
     const typedJs = Data.get(id);
 
     if (typedJs) {
-        const { el, typed } = typedJs;
+        const { el, invoke, callbacks, typed } = typedJs;
         typed.destroy();
 
-        if (text) {
-            options.strings = [text];
-        }
-        if (options.strings === void 0) {
-            options.strings = [""];
-        }
-        typedJs.typed = new Typed(el, options);
+        typedJs.typed = new Typed(el, getOptions(text, invoke, options, callbacks));
     }
 }