I have created what amounts to a single page application with Avalonia. In this application, layout like this : layout, As shown in the img , on the left is NavigationView, and on the right is the Frame Control. I would like to use Frame Control to display those two pages(home , tools).

code like this:

                    <ui:NavigationView PaneDisplayMode="Left" IsBackButtonVisible="False"
                                       IsSettingsVisible="False"
                                       IsPaneToggleButtonVisible="False"
                                       Width="80"
                                       ItemInvoked="NavView_OnItemInvoked"
                                       Name = "NavView">
                        
                        <ui:NavigationView.MenuItems >
                            <ui:NavigationViewItem Content="Home"
                                                    Tag="Home"
                                                   SelectsOnInvoked="True"
                                                   ></ui:NavigationViewItem>
                            <ui:NavigationViewItem Content="tools"
                                Tag="Tools"
                                                   SelectsOnInvoked="True"
                            ></ui:NavigationViewItem>
                        </ui:NavigationView.MenuItems>
                        
                        <ui:Frame Name="Frame"></ui:Frame>
                    </ui:NavigationView>


                <ContentControl Grid.Column="1" Margin="10,10,0,0"
                                CornerRadius="50"
                                >
                    <ui:Frame Name="Frame2" Navigated="Frame2_OnNavigated" ></ui:Frame>
                </ContentControl>

And I also do somethings on subpage what display on Frame Controls

Such as HomePage(HomeView)，I have placed two controls in this view, one is TextBlock and the other is a Button,

I have Binding both of these two Controls

this is Code:

    <Grid ShowGridLines="True">
        <TextBlock Width="300" Background = "Red" Text="{Binding GTER, FallbackValue='null'}"></TextBlock>
        <Button Background = "Transparent" BorderBrush = "Transparent" Command="{Binding ButtonAction}">名字</Button>
    </Grid>

When i execute it , A ERROR HAS BEEN THROWN!

ERROR LIKE THIS

System.InvalidCastException: Unable to cast object of type 'APP.ViewModels.MainWindowViewModel' to type 'APP.ViewModels.HomeViewModel

I have found a solution on GitHub Link

I followed his advice and modified my code:

        <TextBlock Width="300" Background = "Red" Text="{Binding $parent.((vm:HomeViewModel)DataContext).GTER, FallbackValue='null'}"></TextBlock>
        <Button Background = "Transparent" BorderBrush = "Transparent" Command="{Binding $parent.((vm:HomeViewModel)DataContext).ButtonAction">名字</Button>

BUT IT DID NOT WORK!

TextBlock always display null instead of the Binding value

Button also becomes unClickable

Please forgive me for my poor English. Anybody give me a clue as to what I am doing wrong? 🙁