时间戳

首页 > 解决方案 > Blazor 导航：在不更改重新加载页面的情况下更新 URL

c# - Blazor 导航：在不更改重新加载页面的情况下更新 URL

问题描述

我在我的应用程序中使用 URL 参数来表示页面状态。

如何在不实际导航的情况下更改 URL？

谢谢！

（使用 blazor 服务器端）

标签： c#blazorblazor-server-side

解决方案

您可以使用 JS Interop 执行此操作并调用history.pushState(null, '', url)

这是一个简单的例子

。剃刀

@page "/"
@inject IJSRuntime jsRuntime

<input
    @bind="url"
/>

<button @onclick="ChangeUrl">
    Change Url
</button>

<p>@url</p>

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

    void ChangeUrl(){
        // You can also change it to any url you want
        jsRuntime.InvokeVoidAsync("ChangeUrl", Url);
    }
}

.js

window.ChangeUrl = function(url){
    history.pushState(null, '', url);   
}

请注意，这仅适用于视觉目的，它只会在服务器端更改浏览器，您可能不会看到更改。

推荐阅读