在 Blazor 项目中, 如果我们需要想要在点击模态对话框的遮罩层时关闭对话框, 我们可以通过自定义一个Modal组件来实现这个功能。以下是一个简单的例子：

首先，创建一个Modal.razor组件，并且在模态对话框外的div中注册一个点击事件处理程序。代码如下：

@if (IsVisible)
{
    <div class="modal" style="display:block" @onclick="Close">
        <div class="modal-dialog" @onclick:stopPropagation>
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">@Title</h5>
                    <button type="button" class="close" @onclick="Close">
                        <span>&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    @Body
                </div>
            </div>
        </div>
    </div>
}

@code {
    [Parameter]
    public string Title { get; set; }

    [Parameter]
    public RenderFragment Body { get; set; }

    [Parameter]
    public bool IsVisible { get; set; }

    [Parameter]
    public EventCallback<bool> IsVisibleChanged { get; set; }

    private async Task Close()
    {
        IsVisible = false;
        await IsVisibleChanged.InvokeAsync(IsVisible);
    }
}

以上代码实现了一个简单的模态对话框，当用户点击模态对话框外面的区域（遮罩层）或者关闭按钮时，模态对话框会被关闭。

需要注意的是，模态对话框内容的点击事件被阻止了冒泡（@onclick:stopPropagation），这样在点击模态对话框内容区域时，不会触发遮罩层的点击事件。

接着，可以在父组件中像这样使用这个模态对话框：

<button class="btn btn-primary" @onclick="OpenModal">Open Modal</button>

<Modal Title="My Modal" IsVisible="@isModalVisible" IsVisibleChanged="HandleVisibilityChanged">
    <p>Modal content goes here...</p>
</Modal>

@code {
    private bool isModalVisible = false;

    private void OpenModal()
    {
        isModalVisible = true;
    }

    private void HandleVisibilityChanged(bool isVisible)
    {
        isModalVisible = isVisible;
    }
}

以上代码会创建一个按钮，当用户点击这个按钮时，会打开模态对话框。当用户点击模态对话框的遮罩层或者关闭按钮时，模态对话框会被关闭。