Apmannen / MichaelKjellander

Upcoming michaelkjellander.se site. WORK IN PROGRESS. Built with Blazor (.NET/C#), using the Wordpress API to fetch all existing posts and pages from the old (current) site. Tailwind is used for styling.
https://new.michaelkjellander.se/
0 stars 0 forks source link

Notes to self #39

Open Apmannen opened 2 weeks ago

Apmannen commented 2 weeks ago

Rendering

StateHasChanged(); can be called to notify an update. https://learn.microsoft.com/en-us/aspnet/core/blazor/javascript-interoperability/location-of-javascript?view=aspnetcore-8.0

Could for instance be used when loading a page with async calls without await.

protected override async Task OnInitializedAsync() { GetData(); } private async Task GetData() { _pageData = await GetPage(); StateHasChanged(); }

UPDATE: The problem with this is that e.g. the page title needs to be set before the page is loaded and doesn't get updated if it's dependent on fetched items.

Apmannen commented 2 weeks ago

OnInitializedAsync is called twice

https://learn.microsoft.com/en-us/aspnet/core/blazor/components/lifecycle?view=aspnetcore-8.0#component-initialization-oninitializedasync

Blazor apps that prerender their content on the server call OnInitializedAsync twice:

Once when the component is initially rendered statically as part of the page. A second time when the browser renders the component.

To prevent developer code in OnInitializedAsync from running twice when prerendering, see the Stateful reconnection after prerendering section. The content in the section focuses on Blazor Web Apps and stateful SignalR reconnection. To preserve state during the execution of initialization code while prerendering, see Prerender ASP.NET Core Razor components.

Apmannen commented 2 weeks ago

Elements can be referenced

Elements can be referenced, similar to React ref.

<div @ref="divElement">Text during render</div>

await JS.InvokeVoidAsync("setElementText1", divElement, "Text after render");

Could be useful for my modals? https://learn.microsoft.com/en-us/aspnet/core/blazor/components/lifecycle?view=aspnetcore-8.0#component-initialization-oninitializedasync https://github.com/Apmannen/MichaelKjellander/issues/10