Asp.net 使用@page路由模板可断开razor页面中的razor组件

Asp.net 使用@page路由模板可断开razor页面中的razor组件,asp.net,asp.net-core,razor-pages,asp.net-core-3.1,razor-components,Asp.net,Asp.net Core,Razor Pages,Asp.net Core 3.1,Razor Components,我有以下页面Index.cshtml: @page "/Test/{value?}" @model Test01.Areas.Test.Pages.IndexModel <h1>Test</h1> <h3>@Model.value</h3> @(await Html.RenderComponentAsync<Test01.Components.Test>(RenderMode.ServerPrerendered)) 使用ra

我有以下页面Index.cshtml:

@page "/Test/{value?}"
@model Test01.Areas.Test.Pages.IndexModel


<h1>Test</h1>

<h3>@Model.value</h3>


@(await Html.RenderComponentAsync<Test01.Components.Test>(RenderMode.ServerPrerendered))
使用razor组件Test.razor:

<div>
    <button class="btn btn-primary" @onclick="openModal">Open Modal</button>
</div>


@if (showModal)
{
    <div class="modal" tabindex="-1" style="display:block" role="dialog">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h3 class="modal-title">Modal 1</h3>
                    <button type="button" class="close" @onclick="closeModal">
                        <span aria-hidden="true">X</span>
                    </button>
                </div>
                <div class="modal-body">
                    Modal Body
                </div>
                <div class="modal-footer">
                    Modal Footer
                </div>
            </div>
        </div>
    </div>
}


<hr />

@code {
    protected bool showModal = false;

    protected void openModal()
    {
        this.showModal = true;
    }

    protected void closeModal()
    {
        this.showModal = false;
    }
}


开放模态
@如果(显示模式)
{
模式1
X
模态体
模态页脚
}

@代码{ 受保护的bool showmodel=false; 受保护的void openModal() { this.showModal=true; } 受保护的void closeModal() { this.showModal=false; } }
当我调用没有以下值的页面时:

当我单击“打开模式”按钮时,它会按预期工作


当我使用以下值调用页面时:

单击“打开模式”按钮时,不会发生任何情况



感谢您的帮助

很快就明白了

我必须补充:

<base href="~/" />

到my_Layout.cshtml的标记

<base href="~/" />