Question

我首先使用了新的 ASP.NET核心Web应用和出色的客户端模板（3.0.0-preview4-19216-03）。

要向现有Counter.razor页添加状态，我添加了以下类：

public class GlobalCounter
{
    private int _count;
    public int Count
    {
        get => _count;
        set
        {
            if (_count == value) return;

            _count = value;
            CounterChanged.Invoke(this, new CounterChangedEventArgs(_count));
        }
    }

    public GlobalCounter(int initialCount = 0)
    {
        _count = initialCount;
    }

    public event EventHandler<CounterChangedEventArgs> CounterChanged;
}

public class CounterChangedEventArgs : EventArgs
{
    public int Count { get; }
    public CounterChangedEventArgs(int count)
    {
        Count = count;
    }
}

在Startup.cs内添加到 ConfigureServices 方法以下：

public void ConfigureServices(IServiceCollection services)
{
    var counter = new GlobalCounter();
    services.AddSingleton(counter);
}

接下来，我将要注入的单例添加到Counter.razor页中：

@inject GlobalCounter _counter;

还将以下代码添加到页面的@functions：

protected override async Task OnInitAsync()
{
    currentCount = _counter.Count;
    _counter.CounterChanged += CounterChanged;
    await Task.CompletedTask;
}

void CounterChanged(object sender, CounterChangedEventArgs args)
{
    currentCount = args.Count;
}

void IncrementCount()
{
   _counter.Count++;
}

直到现在它可以按预期工作，离开页面或重新加载将保留旧计数。

接下来，我调整了 index.razor 以注入计数器并显示点击的计数。

@page "/"
@inject GlobalCounter _counter;

<h1>Hello, world!</h1>

Welcome to your new app.

<SurveyPrompt Title="How is Blazor working for you?" />

You pressed the coutner @totalCount times.

@functions {
    private int totalCount = 0;

    protected override async Task OnInitAsync()
    {
        totalCount = _counter.Count;
        _counter.CounterChanged += CounterChanged;
        await Task.CompletedTask;
    }

    void CounterChanged(object sender, CounterChangedEventArgs args)
    {
        totalCount = args.Count;
    }
}

这也按预期工作。按下“计数器”页面上的“ 点击我”按钮，然后导航回到索引页面，将显示正确的计数。

这是我的问题，一旦我将<Counter />页作为组件添加到index.razor中，按“ 点击我”按钮，就会更新计数组件，而不是索引页面上显示的文本。

是否需要显式调用以重新渲染依赖组件或页面之间的某些特定绑定？

Answer 1

在index.razor中尝试一下：

void CounterChanged(object sender, CounterChangedEventArgs args)
{
    totalCount = args.Count;

    StateHasChanged();
}

您必须告诉Blazor组件的状态已更改，应该重新渲染。

顺便说一句，因为在触发“单击我”按钮的单击事件后Blazor调用了StateHasChanged方法，所以Counter组件中的值会自动更新。引发任何事件类型的事件后，都会自动调用StateHasChanged方法。

参数更新后，Blazor页面未重新呈现

1 个答案: