问题描述
我有一个 Blazor 服务器端单页应用程序。在它的一个组件中,我有一个简单的 bootstrap 4 可折叠面板:
FFSCreateOutgoingInvoice
当用户点击链接时,不是折叠(或打开)面板,而是刷新整个应用程序,因为来自 https://localhost:44333/mycurrentcomponent 的 url 变为 https://localhost:44333/#demo .
如何使可折叠面板正常工作?
解决方法
我只是跳过 Bootstrap 机制,其中可能包含未在 Blazor 中使用的 Javascript。
在 Blazor 中做这种事情很简单:
<a @onclick="()=> IsCollapsed = !IsCollapsed" style="text-decoration:underline;color:navy;cursor:pointer">Collapsible</a>
@if (!IsCollapsed)
{
<div id="demo">
Lorem ipsum dolor text....
</div>
}
@code {
bool IsCollapsed;
}