Can Blazor open a URL in a new tab using UriHelper NavigateTo?

Platform: Blazor| Category : General, Routing, JavaScript Interop

No, the NavigateTo method in the UriHelper class of Blazor does not have built-in support for opening a URL in a new tab. It is primarily used to navigate within the same browser tab. 

To open a URL in a new tab or window, you can use JavaScript interop in Blazor. Here’s an example of how you can achieve this: 

[index.razor] 

@page "/" 
@inject IJSRuntime jsRuntime 
@inject NavigationManager uriHelper 
@using Microsoft.AspNetCore.Components 

<h1>Navigate</h1> 
<p>Enter a URL to navigate to:</p> 
<input type="text" @bind="@url" /> 
<br /> 
<label> 
    <input type="checkbox" @bind="@openInNewTab" /> 
    Open in new tab 
</label> 
<br /> 
<button @onclick="NavigateToUrl">Go</button> 

@code { 
    private string? url { get; set; } 
    private bool openInNewTab { get; set; } 
    private void NavigateToUrl () 
    { 
        if (openInNewTab) 
        { 
            jsRuntime.InvokeVoidAsync("open", url, "_blank"); 
        } 
        else 
        { 
            uriHelper.NavigateTo(url); 
        } 
    } 
} 

Refer to this thread for more information. 
 
View Sample in GitHub 

Share with

Related FAQs

Couldn't find the FAQs you're looking for?

Please submit your question and answer.