在 Blazor 應用程序中完成計時器后顯示消息

Question

我在剃刀組件上的 Blazor 應用程序中制作了一個計時器。 它工作正常，但我想添加其他內容，例如計時器完成時顯示一條消息，例如“完成”或“計時器完成”或任何其他消息。 這是代碼：

@page "/Counting"
<h1>Counter</h1>   
<p>Current count: @_currentCount</p>
<p>@value</p>
<p>Stop: @stop</p>
<p>Date: @date</p>
<p>diff: @x</p>

@code {
Timer _updateTimer;
int _currentCount = 0;
TimeSpan value= new TimeSpan(0,0,0);
DateTime date;
DateTime stop;
double x;

public void Dispose()
    {
       //_updateTimer.Dispose();
    }
  protected override async Task OnInitializedAsync()
{
  _updateTimer = new Timer(state => { InvokeAsync(UpdateCounter); }, null, 0, 500);
  await Counter();
}
 async Task UpdateCounter()
{
    //_currentCount = 0;
   //await Task.Delay(1000);
   _currentCount++;
   await Task.Delay(1000);
   //_currentCount++;
   StateHasChanged();
 }
  async Task Counter()
{
   while (true)
{
   date = DateTime.Now;
   stop = new DateTime(2020,3,21, 12,20,0);
   value = value.Add(new TimeSpan(0, 0, 1));
   x = (stop - date).TotalSeconds;
   if (x < 0  )
        {
            return;
        }
       await Task.Delay(1000);
       StateHasChanged();
     }
    }
   }  

Answer 1

在您的剃須刀組件中：

@if (x < 0)
{
    <div class="alert alert-info">Timer is done</div>
}