Dreamescaper / BlazorBindings.Maui

MAUI Blazor Bindings - Build native and hybrid MAUI apps with Blazor
MIT License
251 stars 23 forks source link

Is there a way to override OnAppearing()? #122

Closed shugaoye closed 1 year ago

shugaoye commented 1 year ago

We can override content page method OnAppearing() in XAML. Is there a way to do the same in Razor page?

Razor page uses OnInitialized(), OnParametersSetAsync() or OnAfterRenderAsync() etc., but these methods cannot replace OnAppearing(), OnNavigated() etc. content page life cycle methods.


I can create a derived class of content page to override lifecycle methods such as OnAppearing().

    public class ItemListPage : ContentPage
    {
        protected override void OnAppearing()
        {
            base.OnAppearing();
        }
    }

<ItemListPage>
    <RefreshView OnRefreshing="LoadItems" IsRefreshing="IsBusy">
        <ListView ItemsSource="Items">
            <ItemTemplate>
                <ViewCell>
                    <Label>@context.Name</Label>
                    <Label>@context.Description</Label>
                </ViewCell>
            </ItemTemplate>
        </ListView>
    </RefreshView>
</ItemListPage>

It seems this cannot work. It got the below error message.

Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing root component 0 (PassXYZ.Vault.AppShell)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 0 of type PassXYZ.Vault.AppShell
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 1 (BlazorBindings.Maui.Elements.Shell) as child of 0 (PassXYZ.Vault.AppShell)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 1 of type BlazorBindings.Maui.Elements.Shell
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 2 (BlazorBindings.Maui.Elements.TabBar) as child of 1 (BlazorBindings.Maui.Elements.Shell)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 3 (BlazorBindings.Maui.Elements.FlyoutItem) as child of 1 (BlazorBindings.Maui.Elements.Shell)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 4 (BlazorBindings.Maui.Elements.FlyoutItem) as child of 1 (BlazorBindings.Maui.Elements.Shell)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 5 (BlazorBindings.Maui.Elements.MenuItem) as child of 1 (BlazorBindings.Maui.Elements.Shell)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 2 of type BlazorBindings.Maui.Elements.TabBar
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 6 (BlazorBindings.Maui.Elements.ShellContent) as child of 2 (BlazorBindings.Maui.Elements.TabBar)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 3 of type BlazorBindings.Maui.Elements.FlyoutItem
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 7 (BlazorBindings.Maui.Elements.ShellContent) as child of 3 (BlazorBindings.Maui.Elements.FlyoutItem)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 4 of type BlazorBindings.Maui.Elements.FlyoutItem
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 8 (BlazorBindings.Maui.Elements.ShellContent) as child of 4 (BlazorBindings.Maui.Elements.FlyoutItem)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 5 of type BlazorBindings.Maui.Elements.MenuItem
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 6 of type BlazorBindings.Maui.Elements.ShellContent
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 9 (PassXYZ.Vault.Pages.LoginPage) as child of 6 (BlazorBindings.Maui.Elements.ShellContent)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 7 of type BlazorBindings.Maui.Elements.ShellContent
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 10 (PassXYZ.Vault.Pages.AboutPage) as child of 7 (BlazorBindings.Maui.Elements.ShellContent)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 8 of type BlazorBindings.Maui.Elements.ShellContent
Exception thrown: 'System.ArgumentNullException' in Microsoft.Extensions.Logging.Abstractions.dll
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 11 (PassXYZ.Vault.Pages.ItemsPage) as child of 8 (BlazorBindings.Maui.Elements.ShellContent)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 9 of type PassXYZ.Vault.Pages.LoginPage
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 12 (BlazorBindings.Maui.Elements.ContentPage) as child of 9 (PassXYZ.Vault.Pages.LoginPage)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 10 of type PassXYZ.Vault.Pages.AboutPage
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 13 (BlazorBindings.Maui.Elements.ContentPage) as child of 10 (PassXYZ.Vault.Pages.AboutPage)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 11 of type PassXYZ.Vault.Pages.ItemsPage
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 14 (BlazorBindings.Maui.Elements.RefreshView) as child of 11 (PassXYZ.Vault.Pages.ItemsPage)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 15 (BlazorBindings.Maui.Elements.VerticalStackLayout) as child of 11 (PassXYZ.Vault.Pages.ItemsPage)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 12 of type BlazorBindings.Maui.Elements.ContentPage
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 16 (BlazorBindings.Maui.Elements.Internal.ContentPropertyComponent`1[Microsoft.Maui.Controls.ContentPage]) as child of 12 (BlazorBindings.Maui.Elements.ContentPage)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 13 of type BlazorBindings.Maui.Elements.ContentPage
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 17 (BlazorBindings.Maui.Elements.Internal.ContentPropertyComponent`1[Microsoft.Maui.Controls.ContentPage]) as child of 13 (BlazorBindings.Maui.Elements.ContentPage)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 14 of type BlazorBindings.Maui.Elements.RefreshView
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 18 (BlazorBindings.Maui.Elements.Internal.ContentPropertyComponent`1[Microsoft.Maui.Controls.ContentView]) as child of 14 (BlazorBindings.Maui.Elements.RefreshView)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 15 of type BlazorBindings.Maui.Elements.VerticalStackLayout
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 19 (BlazorBindings.Maui.Elements.Internal.ListContentPropertyComponent`2[Microsoft.Maui.Controls.Layout,Microsoft.Maui.IView]) as child of 15 (BlazorBindings.Maui.Elements.VerticalStackLayout)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 16 of type BlazorBindings.Maui.Elements.Internal.ContentPropertyComponent`1[Microsoft.Maui.Controls.ContentPage]
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 20 (BlazorBindings.Maui.Elements.VerticalStackLayout) as child of 16 (BlazorBindings.Maui.Elements.Internal.ContentPropertyComponent`1[Microsoft.Maui.Controls.ContentPage])
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 17 of type BlazorBindings.Maui.Elements.Internal.ContentPropertyComponent`1[Microsoft.Maui.Controls.ContentPage]
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 21 (BlazorBindings.Maui.Elements.Grid) as child of 17 (BlazorBindings.Maui.Elements.Internal.ContentPropertyComponent`1[Microsoft.Maui.Controls.ContentPage])
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 18 of type BlazorBindings.Maui.Elements.Internal.ContentPropertyComponent`1[Microsoft.Maui.Controls.ContentView]
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 22 (BlazorBindings.Maui.Elements.ListView`1[PassXYZ.Vault.Models.Item]) as child of 18 (BlazorBindings.Maui.Elements.Internal.ContentPropertyComponent`1[Microsoft.Maui.Controls.ContentView])
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 19 of type BlazorBindings.Maui.Elements.Internal.ListContentPropertyComponent`2[Microsoft.Maui.Controls.Layout,Microsoft.Maui.IView]
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 23 (BlazorBindings.Maui.Elements.Button) as child of 19 (BlazorBindings.Maui.Elements.Internal.ListContentPropertyComponent`2[Microsoft.Maui.Controls.Layout,Microsoft.Maui.IView])
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 20 of type BlazorBindings.Maui.Elements.VerticalStackLayout
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 24 (BlazorBindings.Maui.Elements.Internal.ListContentPropertyComponent`2[Microsoft.Maui.Controls.Layout,Microsoft.Maui.IView]) as child of 20 (BlazorBindings.Maui.Elements.VerticalStackLayout)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 21 of type BlazorBindings.Maui.Elements.Grid
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 25 (BlazorBindings.Maui.Elements.Internal.ListContentPropertyComponent`2[Microsoft.Maui.Controls.Layout,Microsoft.Maui.IView]) as child of 21 (BlazorBindings.Maui.Elements.Grid)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 22 of type BlazorBindings.Maui.Elements.ListView`1[PassXYZ.Vault.Models.Item]
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 26 (BlazorBindings.Maui.Elements.DataTemplates.SyncDataTemplateItemsComponent`2[Microsoft.Maui.Controls.ItemsView`1[Microsoft.Maui.Controls.Cell],PassXYZ.Vault.Models.Item]) as child of 22 (BlazorBindings.Maui.Elements.ListView`1[PassXYZ.Vault.Models.Item])
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 23 of type BlazorBindings.Maui.Elements.Button
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 24 of type BlazorBindings.Maui.Elements.Internal.ListContentPropertyComponent`2[Microsoft.Maui.Controls.Layout,Microsoft.Maui.IView]
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 27 (BlazorBindings.Maui.Elements.Button) as child of 24 (BlazorBindings.Maui.Elements.Internal.ListContentPropertyComponent`2[Microsoft.Maui.Controls.Layout,Microsoft.Maui.IView])
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 25 of type BlazorBindings.Maui.Elements.Internal.ListContentPropertyComponent`2[Microsoft.Maui.Controls.Layout,Microsoft.Maui.IView]
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 28 (BlazorBindings.Maui.Elements.GridCell) as child of 25 (BlazorBindings.Maui.Elements.Internal.ListContentPropertyComponent`2[Microsoft.Maui.Controls.Layout,Microsoft.Maui.IView])
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 29 (BlazorBindings.Maui.Elements.GridCell) as child of 25 (BlazorBindings.Maui.Elements.Internal.ListContentPropertyComponent`2[Microsoft.Maui.Controls.Layout,Microsoft.Maui.IView])
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 26 of type BlazorBindings.Maui.Elements.DataTemplates.SyncDataTemplateItemsComponent`2[Microsoft.Maui.Controls.ItemsView`1[Microsoft.Maui.Controls.Cell],PassXYZ.Vault.Models.Item]
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 27 of type BlazorBindings.Maui.Elements.Button
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 28 of type BlazorBindings.Maui.Elements.GridCell
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 30 (BlazorBindings.Maui.Elements.VerticalStackLayout) as child of 28 (BlazorBindings.Maui.Elements.GridCell)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 29 of type BlazorBindings.Maui.Elements.GridCell
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 31 (BlazorBindings.Maui.Elements.ScrollView) as child of 29 (BlazorBindings.Maui.Elements.GridCell)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 30 of type BlazorBindings.Maui.Elements.VerticalStackLayout
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 32 (BlazorBindings.Maui.Elements.Internal.ListContentPropertyComponent`2[Microsoft.Maui.Controls.Layout,Microsoft.Maui.IView]) as child of 30 (BlazorBindings.Maui.Elements.VerticalStackLayout)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 31 of type BlazorBindings.Maui.Elements.ScrollView
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 33 (BlazorBindings.Maui.Elements.Internal.ContentPropertyComponent`1[Microsoft.Maui.Controls.ScrollView]) as child of 31 (BlazorBindings.Maui.Elements.ScrollView)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 32 of type BlazorBindings.Maui.Elements.Internal.ListContentPropertyComponent`2[Microsoft.Maui.Controls.Layout,Microsoft.Maui.IView]
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 34 (BlazorBindings.Maui.Elements.Image) as child of 32 (BlazorBindings.Maui.Elements.Internal.ListContentPropertyComponent`2[Microsoft.Maui.Controls.Layout,Microsoft.Maui.IView])
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 33 of type BlazorBindings.Maui.Elements.Internal.ContentPropertyComponent`1[Microsoft.Maui.Controls.ScrollView]
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 35 (BlazorBindings.Maui.Elements.VerticalStackLayout) as child of 33 (BlazorBindings.Maui.Elements.Internal.ContentPropertyComponent`1[Microsoft.Maui.Controls.ScrollView])
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 34 of type BlazorBindings.Maui.Elements.Image
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 35 of type BlazorBindings.Maui.Elements.VerticalStackLayout
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 36 (BlazorBindings.Maui.Elements.Internal.ListContentPropertyComponent`2[Microsoft.Maui.Controls.Layout,Microsoft.Maui.IView]) as child of 35 (BlazorBindings.Maui.Elements.VerticalStackLayout)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 36 of type BlazorBindings.Maui.Elements.Internal.ListContentPropertyComponent`2[Microsoft.Maui.Controls.Layout,Microsoft.Maui.IView]
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 37 (BlazorBindings.Maui.Elements.Label) as child of 36 (BlazorBindings.Maui.Elements.Internal.ListContentPropertyComponent`2[Microsoft.Maui.Controls.Layout,Microsoft.Maui.IView])
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 38 (BlazorBindings.Maui.Elements.Label) as child of 36 (BlazorBindings.Maui.Elements.Internal.ListContentPropertyComponent`2[Microsoft.Maui.Controls.Layout,Microsoft.Maui.IView])
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 39 (BlazorBindings.Maui.Elements.Label) as child of 36 (BlazorBindings.Maui.Elements.Internal.ListContentPropertyComponent`2[Microsoft.Maui.Controls.Layout,Microsoft.Maui.IView])
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 40 (BlazorBindings.Maui.Elements.Button) as child of 36 (BlazorBindings.Maui.Elements.Internal.ListContentPropertyComponent`2[Microsoft.Maui.Controls.Layout,Microsoft.Maui.IView])
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 37 of type BlazorBindings.Maui.Elements.Label
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 38 of type BlazorBindings.Maui.Elements.Label
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 39 of type BlazorBindings.Maui.Elements.Label
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 41 (BlazorBindings.Maui.Elements.Span) as child of 39 (BlazorBindings.Maui.Elements.Label)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Initializing component 42 (BlazorBindings.Maui.Elements.Span) as child of 39 (BlazorBindings.Maui.Elements.Label)
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 40 of type BlazorBindings.Maui.Elements.Button
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 41 of type BlazorBindings.Maui.Elements.Span
Microsoft.AspNetCore.Components.RenderTree.Renderer: Debug: Rendering component 42 of type BlazorBindings.Maui.Elements.Span
Exception thrown: 'System.InvalidOperationException' in System.Private.CoreLib.dll
An exception of type 'System.InvalidOperationException' occurred in System.Private.CoreLib.dll but was not handled in user code
Failed to find ElementHandler for 'ItemListPage'
Dreamescaper commented 1 year ago

First of all - could you describe your use case? Why do you want to override it?

Dreamescaper commented 1 year ago

There is no easy way to override OnAppearing method.

However, there's also Appearing event in Maui controls, which maps to OnAppearing EventCallback property. Most likely it will work for your needs. You can take a look at the example here: https://github.com/Dreamescaper/BlazorBindings.Maui/blob/e3f5005785107713462314566de04ea24a05c4db/samples/FluxorSample/ForecastPage.razor#L9

shugaoye commented 1 year ago

There is no easy way to override OnAppearing method.

However, there's also Appearing event in Maui controls, which maps to OnAppearing EventCallback property. Most likely it will work for your needs. You can take a look at the example here:

https://github.com/Dreamescaper/BlazorBindings.Maui/blob/e3f5005785107713462314566de04ea24a05c4db/samples/FluxorSample/ForecastPage.razor#L9

Thanks! I will try this. I want to initialize some data in OnAppearing().

Dreamescaper commented 1 year ago

I assume that the question is answered. Let me know it you have any other questions!

shugaoye commented 1 year ago

I assume that the question is answered. Let me know it you have any other questions! Yes. It's good for me now.