Question

如何使用剃刀页面代码转到页面调用者？

即例如：可以从多个页面调用Check.razor页面。我想根据某些情况返回Check.razor代码中的调用方。

Answer 1

首先，除了常规的路由模板之外，还使用路由参数创建Check组件。第一个允许不带参数的组件导航。第二个@page指令采用{returnurl}路由参数，并将该值分配给下面定义的ReturnUrl属性。

然后添加@inject指令将NavigationManager注入到您的组件中，以便您可以调用其NavigateTo方法，该方法允许您导航到在{returnurl}参数中传递的路由

Check.razor

@page "/check"
@page "/check/{returnurl}"
@inject NavigationManager NavigationManager


<button @onclick="GoBack">Go back</button>

@code {

    [Parameter]
    public string ReturnUrl { get; set; }

    private void GoBack()
    {
       NavigationManager.NavigateTo(ReturnUrl, forceLoad: false);
    }

}

您现在可以从其他组件调用Check组件。添加@inject指令以将NavigationManager注入到您的组件中。首先，我们要提取当前位置；那就是我们的位置：CallCheck方法的第一行做到了。请注意，如果您在Counter组件中并单击“呼叫检查”按钮，则变量returnUrl将包含值“ Counter”，并且如果您在Index组件中（当然，您需要在此处添加相同的代码），变量returnUrl将包含一个空字符串。

提取当前位置后，我们调用NavigateTo方法导航到returnUrl变量中包含的路线。

用法

@inject NavigationManager NavigationManager

<button class="btn btn-primary" @onclick="CallCheck">Call Check</button>


@code 
{
    private void CallCheck()
    {
        var returnUrl = 
              NavigationManager.ToBaseRelativePath(NavigationManager.Uri);


       NavigationManager.NavigateTo($"check/{returnUrl}", forceLoad: false);

    }
}

如何以剃刀代码编程方式重定向到呼叫者？

1 个答案:

Check.razor

用法