在新选项卡中打开文件答案

【问题标题】：Open a file in a new tab在新选项卡中打开文件
【发布时间】：2021-04-16 18:55:00
【问题描述】：

如何在 BLAZOR 的新选项卡中打开文件（pdf 或图像）？

我尝试使用：

await JSRuntime.InvokeVoidAsync("open", new object[2] { path, "_blank" });
using a javascript function with window.open();

在这两种情况下，我都得到：找不到这个 localhost 页面。我该怎么办？

【问题讨论】：

文件来自哪里？
如果你有直接来自文件系统的路径，你可以在 base64 中转换你的文件并在窗口打开时显示一个 blob url。或者，如果您的文件与本地主机位于同一服务器中，您可以使用本地主机服务器的相对路径。
是的，这是我文件系统中的一个文件

标签： javascript c# html blazor

【解决方案1】：

检查图像的正确扩展名或 URL 路径是否正确。

您可以按照以下示例进行操作：

$(document).ready(function(){

    $('img.image').click(function(){

        window.open($(this)[0].src, '_blank')

    });

});

【讨论】：

【解决方案2】：

我可以建议两个选项：

通过按钮。

@inject IJSRuntime jsRuntime

<button @onclick="@LoadPage">Load Page</button>

@code {
    async Task LoadPage()
    {
        await jsRuntime.InvokeAsync<object>("open", "MyPage", "_blank");
    }
}

通过链接。

<a class="dropdown-item" href="MyPage" target="_blank">

您要启动的剃须刀页面顶部有以下内容：

@page "/MyPage"

【讨论】：

【解决方案3】：

如果你想打开一个标签，你可以使用它。

HTML：

<a href=".pdf" target="_blank"></a>

你需要填写你想去的地方的href。

【讨论】：