tfoman/Blazor3state
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Use razer component for states

Browse Source
This commit is contained in:
Tommy Öman
2020-01-06 22:52:12 +01:00
parent 514796de23
commit 383a8720a0
1 changed files with 12 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
Blazor3State/Pages/FetchData.razor
View File

@ -9,23 +9,21 @@
<button class="btn btn-primary" @onclick="LoadImage">New Image</button> <button class="btn btn-primary" @onclick="LoadImage">New Image</button>
<div class="image-container"> <div class="image-container">
@if (state == LoadingContainerState.Loading) <LoadingContainer State="@state">
{ <Loading>
<div class="lds-default"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div> <div class="lds-default"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
} </Loading>
else if (state == LoadingContainerState.Loaded) <Loaded>
{ <img src="https://loremflickr.com/200/300" alt="Alternate text" />
<img src="https://loremflickr.com/200/300" alt="Alternate text" /> </Loaded>
} <ErrorContent>
else if (state == LoadingContainerState.Error) <p><em>An error has occurred. Click new image to try again !</em></p>
{ </ErrorContent>
<p><em>An error has occurred. Click new image to try again !</em></p> </LoadingContainer>
}
</div> </div>
@code { @code {
Random random = new Random(); Random random = new Random();
public enum LoadingContainerState { Loading, Loaded, Error }
LoadingContainerState state; LoadingContainerState state;
protected override async Task OnInitializedAsync() protected override async Task OnInitializedAsync()
@ -36,7 +34,7 @@
async Task LoadImage() async Task LoadImage()
{ {
state = LoadingContainerState.Loading; state = LoadingContainerState.Loading;
await Task.Delay(1000); await Task.Delay(2000);
if (random.Next(3) == 2) if (random.Next(3) == 2)
{ {
state = LoadingContainerState.Error; state = LoadingContainerState.Error;