Cloudcrate.AspNetCore.Blazor.Browser.Storage 3.0.0

Install-Package Cloudcrate.AspNetCore.Blazor.Browser.Storage -Version 3.0.0
dotnet add package Cloudcrate.AspNetCore.Blazor.Browser.Storage --version 3.0.0
<PackageReference Include="Cloudcrate.AspNetCore.Blazor.Browser.Storage" Version="3.0.0" />
For projects that support PackageReference, copy this XML node into the project file to reference the package.
paket add Cloudcrate.AspNetCore.Blazor.Browser.Storage --version 3.0.0
The NuGet Team does not provide support for this client. Please contact its maintainers for support.
#r "nuget: Cloudcrate.AspNetCore.Blazor.Browser.Storage, 3.0.0"
#r directive can be used in F# Interactive, C# scripting and .NET Interactive. Copy this into the interactive tool or source code of the script to reference the package.
// Install Cloudcrate.AspNetCore.Blazor.Browser.Storage as a Cake Addin
#addin nuget:?package=Cloudcrate.AspNetCore.Blazor.Browser.Storage&version=3.0.0

// Install Cloudcrate.AspNetCore.Blazor.Browser.Storage as a Cake Tool
#tool nuget:?package=Cloudcrate.AspNetCore.Blazor.Browser.Storage&version=3.0.0
The NuGet Team does not provide support for this client. Please contact its maintainers for support.

Blazor Local and Session Storage Support

Installation

PM> Install-Package Cloudcrate.AspNetCore.Blazor.Browser.Storage

See it in Action

Check out Steve Sanderson's demo at NDC Minnesota, at minute 48

Usage

Add Services to Dependency Injection

services.AddStorage();

Add Javascript file to your index.html or _Host.cshtml page in <body>

<app>@(await Html.RenderComponentAsync<App>())</app>
<script src="_framework/blazor.server.js"></script>
<script src="_content/Cloudcrate.AspNetCore.Blazor.Browser.Storage/Storage.js"></script>

Client-Side

Inject and use Storage

@using Cloudcrate.AspNetCore.Blazor.Browser.Storage;
@inject LocalStorage Storage

<input type="text" @bind="value" />
<button @onclick="SetValue">Set</button>
<button @onclick="GetValue">Get</button>


@code
{
    string value;

    void SetValue()
    {
        Storage.SetItem("storageKey", value);
    }

    void GetValue()
    {
        value = Storage.GetItem("storageKey");
    }
}

Server-Side

Inject and use Storage

@using Cloudcrate.AspNetCore.Blazor.Browser.Storage;
@inject LocalStorage Storage

<input type="text" @bind="value" />
<button @onclick="SetValue">Set</button>
<button @onclick="GetValue">Get</button>


@code
{
    string value;

    Task SetValue()
    {
        await Storage.SetItemAsync("storageKey", value);
    }

    Task GetValue()
    {
        value = await Storage.GetItemAsync("storageKey");
    }
}

Events

Using storage native event: StorageEvent

protected override void OnInit()
{
    Storage.StorageChanged += HandleStorageChanged;
}

void HandleStorageChanged(object sender, StorageEventArgs e)  
{  
    Console.WriteLine($"Value for key {e.Key} changed from {e.OldValue} to {e.NewValue}");
} 

public void Dispose()
{
    Storage.StorageChanged -= HandleStorageChanged;
}

Contributors

NuGet packages

This package is not used by any NuGet packages.

GitHub repositories (1)

Showing the top 1 popular GitHub repositories that depend on Cloudcrate.AspNetCore.Blazor.Browser.Storage:

Repository Stars
noahc3/SDSetup
The Ninite for your Nintendo Switch.
Version Downloads Last updated
3.0.0 21,744 9/27/2019
3.0.0-preview9.19424.4.2 448 9/5/2019
3.0.0-preview8.19405.7.1 299 8/20/2019
3.0.0-preview7.19365.7 393 7/24/2019
3.0.0-preview6.19307.4 400 6/15/2019
3.0.0-preview5-19227-02 516 5/7/2019
3.0.0-preview5-19227-01-02 321 5/7/2019
3.0.0-preview5-19227-01-01 349 5/7/2019
0.9.0-preview3-01 679 3/29/2019
0.9.0-preview3 348 3/26/2019
0.5.1 3,652 7/30/2018
0.5.0-preview3 518 7/23/2018
0.5.0-preview2 589 7/9/2018
0.5.0-preview1 591 7/8/2018
0.2.2 1,154 5/4/2018
0.2.1 674 5/3/2018
0.2.1-preview4 617 5/3/2018
0.2.1-preview3 577 5/3/2018
0.2.1-preview2 634 4/30/2018
0.2.1-preview1 644 4/30/2018