Cvičení – funkce platformy Access v hybridním prostředí Blazor

Dokončeno

V tomto cvičení přidáte možnost uložit a načíst seznam úkolů do systému souborů.

Přidání tlačítek pro načtení a uložení

1. Začněme přidáním dvou nových <button> prvků pro načtení a uložení tlačítka pod <h3> seznamem položek úkolů v souboru Todo.razor .

   @page "/todo"
   @using BlazorHybridApp.Data
   
   <h3>Todo (@todos.Count(todo => !todo.IsDone))</h3>
   
   <button @onclick="Save">Save</button>
   <button @onclick="Load">Load</button>
   
   <ul class="list-unstyled">
       @foreach (var todo in todos)
       {
           <li>
               <input type="checkbox" @bind="todo.IsDone" />
               <input @bind="todo.Title" />
           </li>
       }
   </ul>
   

2. Přidejte do @code bloku dvě metody a Save Load funkce:

   private async Task Save()
   {
   }
   
   private void Load()
   {
   }
   

Uložení a načtení dat na disk

.NET obsahuje System.IO obor názvů, který zahrnuje možnost načíst a uložit soubory na disk. .NET MAUI tuto funkci automaticky mapuje na nativní rozhraní API; Stačí zadat, kam se má soubor uložit. Každá platforma má speciální umístění pro ukládání uživatelských dat. Pomocné rutiny systému souborů v .NET MAUI poskytují přístup k získání více adresářů platformy, včetně adresářů dat mezipaměti a aplikací. Může také načíst soubory, které jsou součástí přímo do aplikace. Teď implementujme metodu Save pomocí System.Text.Json, která je integrovaná do .NET.

1. Přidejte direktivy using pro Microsoft.Maui.Storage, System.Text.Jsona System.IO na začátek souboru Todo.razor .

   @page "/todo"
   @using BlazorHybridApp.Data
   @using Microsoft.Maui.Storage
   @using System.IO
   @using System.Text.Json
   

2. Implementujte Save serializací dat do , stringvytvořením cesty pro soubor a zápisem obsahu do souboru:

   private async Task Save()
   {
       var contents = JsonSerializer.Serialize(todos);
       var path = Path.Combine(FileSystem.AppDataDirectory, "todo.json");
       File.WriteAllText(path, contents);
       await App.Current.MainPage.DisplayAlert("List Saved", $"List has been saved to {path}", "OK");
   }
   

   Upozorňujeme, že můžeme také přistupovat k automaticky otevíraných oken platformy. V této části se při uložení souboru zobrazí upozornění.

3. Implementujte Load načtením dat z disku, deserializací dat a načtením položek do seznamu úkolů:

   private void Load()
   {
       var path = Path.Combine(FileSystem.AppDataDirectory, "todo.json");
       if (!File.Exists(path))
           return;
       var contents = File.ReadAllText(path);
       var savedItems = JsonSerializer.Deserialize<List<TodoItem>>(contents);
       todos.Clear();
       todos.AddRange(savedItems);
   }
   

4. Uložte soubor. Restartujte aplikaci, pokud ještě není spuštěná.

5. Přidejte položky, upravte položky a označte položky, které byly provedeny k otestování komponenty. Save Vyberte tlačítko pro uložení položek na disk, pak zavřete a restartujte aplikaci nebo proveďte změny a vyberte Load načtení uložených dat.