问题描述
几天前,我更新了blazored.Modal,但现在我的PopUp无法正常工作。我调整了代码,但仍然无法使用,也找不到问题。我真的不知道该怎么办,我清除了缓存并使用了其他浏览器,但仍然无法正常工作。
代码: App.Razor
<CascadingblazoredModal>
<CascadingAuthenticationState>
<Router AppAssembly="@typeof(Program).Assembly">
<Found Context="routeData">
<RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
</Found>
<NotFound>
<LayoutView Layout="@typeof(MainLayout)">
<p>Sorry,there's nothing at this address.</p>
</LayoutView>
</NotFound>
</Router>
</CascadingAuthenticationState>
</CascadingblazoredModal>
_Imports.razor
@using blazored
@using blazored.Modal
@using blazored.Modal.Services
_Host.razor
@page "/"
@namespace FHNW_ASS.Pages
@addTagHelper *,Microsoft.AspNetCore.Mvc.TagHelpers
@{
Layout = null;
}
<!DOCTYPE html>
<html lang="en">
<head>
<Meta charset="utf-8" />
<Meta name="viewport" content="width=device-width,initial-scale=1.0" />
<title>FHNW-ASS</title>
<base href="~/" />
<link rel="stylesheet" href="css/bootstrap/bootstrap.min.css" />
<link href="css/site.css" rel="stylesheet" />
<link href="_content/blazored.Modal/blazored-modal.css" rel="stylesheet" />
</head>
<body>
<app>
<component type="typeof(App)" render-mode="ServerPrerendered" />
</app>
<div id="blazor-error-ui">
<environment include="Staging,Production">
An error has occurred. This application may no longer respond until reloaded.
</environment>
<environment include="Development">
An unhandled exception has occurred. See browser dev tools for details.
</environment>
<a href="" class="reload">Reload</a>
<a class="dismiss">?</a>
</div>
<script src="_content/blazored.Modal/blazored.modal.js"></script>
</body>
</html>
带有按钮(Journal.razor)的页面
@page "/Journal"
@using FHNW_ASS.Models
@using Microsoft.Extensions.Configuration
@using FHNW_ASS.Services
@inject IConfiguration _config
@inject IModalService modal
@inject IJournalService service
<div class="titleWrapper">
<div class="title">Journale eine go dreieeee</div>
<div class="flexBox">
<div class="content">
<button @onclick="@(() => modal.Show<JournalInputPage>("Add Journal Entry"))" class="additionButton">
<img class="plusIcon" src="/elements/plus-black-symbol.svg" />
Add Journal Entry
</button>
</div>
</div>
</div>
<hr />
<br />
<br />
应弹出的页面(JournalInputPage.razor)
@using Microsoft.Extensions.Configuration
@using FHNW_ASS.Models
@inject FHNW_ASS.Models.FHNW_ASSContext _context
@inject IConfiguration _config
@inject IModalService modal
<!DOCTYPE html>
<head>
<link href="~/css/site.css" rel="stylesheet" />
</head>
<body>
<EditForm Model="@journalInputModel" OnValidSubmit="HandleValidSubmit">
<DataAnnotationsValidator />
<ValidationSummary />
<p>
<label for="title">Journal Title</label> <br />
<InputText id="title" @bind-Value="journalInputModel.JournalTitle" /> <br />
</p>
<p>
<label for="Week">Week</label> <br />
<InputNumber id="week" @bind-Value="journalInputModel.JournalWeek" /> <br />
</p>
<p>
<label for="content">Journal Content</label> <br />
@*<InputText id="content" @bind-Value="JournalInput.JournalContent" />*@
<textarea id="content" rows="10" cols="100" @bind="journalInputModel.JournalContent" />
</p>
@*<InputDate id="create" />
<InputDate id="edit" />*@
<button type="submit" class="submitButton">Submit</button>
</EditForm>
</body>
这就是您所需要的。
解决方法
所以我找到了解决方案。 我不知道为什么,但是我的blazor.server.js不在_Host中。
<script src="_framework/blazor.server.js"></script>