Storage
How to use the Storage class of the bit Butil?
Usage
To use the browser storage features you need to inject the Bit.Butil.Storage class and use it like this:
@inject Bit.Butil.LocalStorage localStorage @inject Bit.Butil.SessionStorage sessionStorage @code { await localStorage.SetItem("my-key", "my-value"); await sessionStorage.SetItem("my-key2", "my-value2"); }
Methods
GetLength:
Returns an integer representing the number of data items stored in the Storage object (MDN).
@inject Bit.Butil.LocalStorage localStorage @inject Bit.Butil.SessionStorage sessionStorage <BitButton OnClick="@GetLength">GetLength</BitButton> <div>LocalStorage length: @localLength</div> <div>SessionStorage length: @sessionLength</div> @code { private string? localLength; private string? sessionLength; private async Task GetLength() { var localResult = await localStorage.GetLength(); localLength = localResult.ToString(); var sessionResult = await sessionStorage.GetLength(); sessionLength = sessionResult.ToString(); } }
GetKey:
When passed a number n, this method will return the name of the nth key in the storage (MDN).
@inject Bit.Butil.LocalStorage localStorage @inject Bit.Butil.SessionStorage sessionStorage <BitSpinButton @bind-Value="keyIndex" /> <BitButton OnClick="@GetKey">GetKey</BitButton> <div>LocalStorage key: @localKey</div> <div>SessionStorage key: @sessionKey</div> @code { private double keyIndex; private string? localKey; private string? sessionKey; private async Task GetKey() { localKey = await localStorage.GetKey((int)keyIndex); sessionKey = await sessionStorage.GetKey((int)keyIndex); } }
GetItem:
When passed a key name, will return that key's value (MDN).
@inject Bit.Butil.LocalStorage localStorage @inject Bit.Butil.SessionStorage sessionStorage <BitTextField @bind-Value="currentLocalItemKey" Label="LocalStorage key" /> <BitTextField @bind-Value="currentSessionItemKey" Label="SessionStorage key" /> <BitButton OnClick="@GetItem">GetItem</BitButton> <div>LocalStorage item: @currentLocalItem</div> <div>SessionStorage item: @currentSessionItem</div> @code { private string? currentLocalItemKey; private string? currentSessionItemKey; private string? currentLocalItem; private string? currentSessionItem; private async Task GetItem() { currentLocalItem = await localStorage.GetItem(currentLocalItemKey); currentSessionItem = await sessionStorage.GetItem(currentSessionItemKey); } }
SetItem:
When passed a key name and value, will add that key to the storage, or update that key's value if it already exists (MDN).
@inject Bit.Butil.LocalStorage localStorage @inject Bit.Butil.SessionStorage sessionStorage <BitTextField @bind-Value="newLocalItemKey" Label="LocalStorage key" /> <BitTextField @bind-Value="newSessionItemKey" Label="SessionStorage key" /> <BitButton OnClick="@SetItem">SetItem</BitButton> @code { private string? newLocalItemKey; private string? newSessionItemKey; private async Task SetItem() { await localStorage.SetItem(newLocalItemKey, newLocalItemKey); await sessionStorage.SetItem(newSessionItemKey, newSessionItemKey); } }
RemoveItem:
When passed a key name, will remove that key from the storage (MDN).
@inject Bit.Butil.LocalStorage localStorage @inject Bit.Butil.SessionStorage sessionStorage <BitTextField @bind-Value="localItemKey" Label="LocalStorage key" /> <BitTextField @bind-Value="sessionItemKey" Label="SessionStorage key" /> <BitButton OnClick="@RemoveItem">RemoveItem</BitButton> @code { private string? localItemKey; private string? sessionItemKey; private async Task RemoveItem() { await localStorage.RemoveItem(localItemKey); await sessionStorage.RemoveItem(sessionItemKey); } }
Clear:
When invoked, will empty all keys out of the storage (MDN).
@inject Bit.Butil.LocalStorage localStorage @inject Bit.Butil.SessionStorage sessionStorage <BitButton OnClick="@Clear">Clear</BitButton> @code { private async Task Clear() { await localStorage.Clear(); await sessionStorage.Clear(); } }