使用参数导航到 Blazor 页面不会呈现布局或任何内容

Question

所以我在 Blazor 应用程序中创建了一个页面 - 它从数据库加载博客故事 - 如果选择 none 则加载一个默认页面 - 没什么大不了的

如果我直接使用故事的参数 id 导航到此页面 - none 主机或主布局 - 所以 none 应用或呈现样式等

如果好奇，页面是 https://www.pepclublocker.com/news-posts/1。

我该怎么做才能解决这个问题？

Answer 1

您的 html head 中缺少 <base href="/" /> 标签，因此 Blazor 在 /new-post 中查找脚本但找不到任何内容。

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">
    <title>Pep Club Locker - Team Apparel Printers & Shop </title>
    <!-- Bootstrap core CSS -->
    <link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <!-- Custom styles for this template -->
    <link href="css/business-frontpage.css" rel="stylesheet">
</head>
<body>
...
<!--Blazor:{"prerenderId":"4ae18037ad8d4418b898ea9715bbefab"}-->
    <script src="_framework/blazor.server.js"></script>
    <script src="_content/Blazor-Analytics/blazor-analytics.js"></script>
    <script src="_content/Blazor-Facebook-Analytics/interop.js"></script>
    <!-- Bootstrap core JavaScript -->
    <script src="vendor/jquery/jquery.min.js"></script>
    <script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
</body>

在 _Host.cshtml 的 head 中添加 <base href="~/" /> 标签应该可以解决您的问题。

_Host.cshtml

<head>
    <base href="~/" />
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">
    <title>Pep Club Locker - Team Apparel Printers & Shop </title>
    <!-- Bootstrap core CSS -->
    <link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <!-- Custom styles for this template -->
    <link href="css/business-frontpage.css" rel="stylesheet">
</head>

使用参数导航到 Blazor 页面不会呈现布局或任何内容

Navigating to Blazor page with parameter does not render layout or anything

blazor

blazor-server-side