c# - Blazor 中的 js 互操作的静态扩展如何工作？

Question

我设法使代码如此平静。

Blazor html：

@inject IJSRuntime js
<button @onclick="Delete">Delete</button>

函数删除（）：

private async Task Delete()
    {
        var confirmed = await js.Confirm($"Are you sure you want to delete?");
    }

静态扩展：

    public static class IJSRuntimeExtensionMethods
    {
        public static async ValueTask<bool> Confirm(this IJSRuntime js, string message)
        {
            return await js.InvokeAsync<bool>("confirm", message);
        }
    }

此代码使 javascript 确认弹出。

我的问题是它是如何工作的？

最令人困惑的部分是：

var confirmed = await js.Confirm($"Are you sure you want to delete?");

为什么我们可以只写Confirm，但不能IJSRuntimeExtensionMethodsInstance.Confirm？

为什么我们还需要这个位js.？

它是如何传递js.Confirm($"Are you sure you want to delete?")给静态扩展的，或者之后的点符号到底在做什么js？

Answer 1

扩展方法是一种语言特性，它允许您扩展任何类或接口的行为。基本上，这只是简化对静态方法的调用并使其看起来像对实例方法的调用的语法糖。

在扩展方法的声明中注意thisbefore IJSRuntime js。这意味着该方法扩展 了IJSRuntime类型：

public static async ValueTask<bool> Confirm(this IJSRuntime js, string message)

在引擎盖下调用

js.Confirm("text");

被翻译成

IJSRuntimeExtensionMethodsInstance.Confirm(js, "text");

你也可以像这样调用方法！