Blazor 级联参数总是在后面 1

Question

我对我在这里做错了什么感到困惑。在我的布局文件中，我有一个 header 部分，该部分应根据我当前所在的页面进行更改。这是布局页面。

<CascadingValue Value="this">
<div class="min-h-full">
    <NavMenu/>


    <header class="bg-white shadow-sm">
        <div class="max-w-7xl mx-auto py-4 px-4 sm:px-6 lg:px-8">
            <h1 class="text-lg leading-6 font-semibold text-gray-900">@PageTitle</h1>
        </div>
    </header>


    <main>
        <div class="max-w-7xl mx-auto py-6 sm:px-6 lg:px-8">
            <div class="px-4 py-4 sm:px-0">
                @Body
            </div>
        </div>
    </main>
</div>
</CascadingValue>

<Footer></Footer>

@PageTitle 是我用来控制 Header 文本的变量。

Code Behind 如此声明。

public string PageTitle { get; set; }

现在在我的视图页面上，我在后面的代码中执行此操作。

[CascadingParameter]
    public MainLayout? Layout { get; set; }

    protected override void OnInitialized()
    {
        Layout.PageTitle = "Current Page Header";
    }

问题是它没有正确更新，我去的第一页会是空白，然后当我点击不同的页面时，它会在 header 部分落后一页。我的猜测是我现在对状态感到困惑，或者我做的完全错了。

非常感谢任何帮助。

Answer 1

您需要将字符串值传递给 MainLayout，然后调用 StateHasChanged 方法 re-render 它。

@code {
        private string _pageTitle ;

        public string PageTitle 
        {
            get => _pageTitle;

            set
            {
                if (_pageTitle != value)
                {
                    _pageTitle = value;
                }

                InvokeAsync(() => StateHasChanged());

            }
        }

    }

Blazor 级联参数总是在后面 1

Blazor Cascading Parameter always 1 behind

c#

blazor

blazor-webassembly

.net-6.0