.Net 6: BlazorServer の使い方 (その2)

こちらの、Fetch Data を改造します。
[.Net Core の BlazorServer の使い方](https://qiita.com/ekzemplaro/items/b642fb7384b40817dce1)

結果
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/179446/7f8cf063-68d1-705e-0110-d55141cdb68c.png)

プロジェクトの作成と実行

```bash
dotnet new blazorserver -o c01
cd c01
dotnet watch run
```

```cs:Program.cs
using Microsoft.AspNetCore.Components;
using Microsoft.AspNetCore.Components.Web;
using c01.Data;

var builder = WebApplication.CreateBuilder(args);

// Add services to the container.
builder.Services.AddRazorPages();
builder.Services.AddServerSideBlazor();
builder.Services.AddSingleton<CityForecastService>();   // 変更

var app = builder.Build();

// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
    app.UseExceptionHandler("/Error");
    // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
    app.UseHsts();
}

app.UseHttpsRedirection();

app.UseStaticFiles();

app.UseRouting();

app.MapBlazorHub();
app.MapFallbackToPage("/_Host");

app.Run();
```

```cs:Pages/FetchData.razor
﻿@page "/fetchdata"

<PageTitle>Weather forecast</PageTitle>

@using c01.Data
@inject CityForecastService ForecastService

<h1>都市人口データ</h1>

<p>This component demonstrates fetching data from a service.</p>

@if (forecasts == null)
{
    <p><em>Loading...</em></p>
}
else
{
    <table class="table">
        <thead>
            <tr>
                <th>キー</th>
                <th>都市名</th>
                <th>人口</th>
                <th>日付</th>
            </tr>
        </thead>
        <tbody>
            @foreach (var forecast in forecasts)
            {
                <tr>
                    <td>@forecast.Key</td>
                    <td>@forecast.Name</td>
                    <td>@forecast.Population</td>
                    <td>@forecast.Date_mod.ToShortDateString()</td>
                </tr>
            }
        </tbody>
    </table>
}

@code {
    private CityForecast[]? forecasts;

    protected override async Task OnInitializedAsync()
    {
        forecasts = await ForecastService.GetForecastAsync(DateTime.Now);
    }
}
```

```cs:Data/CityForecast.cs
namespace c01.Data;

public class CityForecast
{
    public string? Key { get; set; }
    public string? Name { get; set; }
    public int Population { get; set; }
    public DateTime Date_mod { get; set; }
}
```

```cs:Data/CityForecastService.cs
namespace c01.Data;

public class CityForecastService
{
    private static readonly string[] Keys = new[]
    {
        "t0921", "t0922", "t0923", "t0924", "t0925", "t0926", "t0927"
    };


    private static readonly string[] Names = new[]
    {
        "宇都宮","小山","佐野","足利","日光","下野","さくら"
    };

    private static readonly int[] Populations = new[]
    {
        97831,54678,23415,56721,91765,62389,75123
    };

    private static readonly string[] Date_mods = new[]
    {
        "2003-8-12","2003-5-15","2003-6-8","2003-7-21","2003-4-19",
        "2003-10-14","2003-5-24"
    };

    public Task<CityForecast[]> GetForecastAsync(DateTime startDate)
    {
        return Task.FromResult(Enumerable.Range(0, 7).Select(index => new CityForecast
        {
            Key = Keys[index],
            Name = Names[index],
            Population = Populations[index],
            Date_mod = DateTime.Parse(Date_mods[index])

        }).ToArray());
    }
}
```