时间戳

首页 > 解决方案 > 嵌套选项卡视图未绑定到单独的 ViewModel

xamarin - 嵌套选项卡视图未绑定到单独的 ViewModel

问题描述

我想将视图模型绑定到 xamarin prism 框架中的嵌套选项卡视图

我创建了 4 个主页（A、B、C、D）作为主选项卡，并在第一个选项卡（A）中创建了另外两个选项卡（A1、A2）。但是嵌套选项卡的数据没有绑定。甚至该视图的视图模型（ A1,A2) 没有击中

菜单页.xml

<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage  xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="MyApp.Views.MenuPage"
             xmlns:prism="clr-namespace:Prism.Mvvm;assembly=Prism.Forms"
             xmlns:b="clr-namespace:Prism.Behaviors;assembly=Prism.Forms"

             prism:ViewModelLocator.AutowireViewModel="True" 
              xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core"
             xmlns:views="clr-namespace:MyApp.Views"

                BarBackgroundColor="White"
             android:TabbedPage.ToolbarPlacement="Bottom"
             NavigationPage.HasNavigationBar="True">

    <TabbedPage.Children>
        <views:A Title="A" Icon="abc.png" />
        <views:B Title="B" Icon="abc.png" />
        <views:C Title="C" Icon="abc.png" />
        <views:D Title="D" Icon="abc.png"/>
    </TabbedPage.Children>
</TabbedPage>

我的页面A就像

<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
            xmlns:views="clr-namespace:MyApp.Views"
             x:Class="MyApp.Views.A">
    <!--Pages can be added as references or inline-->
    <TabbedPage.Children>
    <views:A1 Title="A1" />
    <views:A2 Title="A2" />

        </TabbedPage.Children>
</TabbedPage>

我对 A1 和 A2 有单独的视图模型。

因此，如果我直接将 A1 绑定到主导航页面，它将正常工作并呈现数据。但是如果我确实喜欢上面的 A1 视图模型，则不会击中构造函数，并且除了静态数据之外什么都没有显示。我是选项卡式页面导航的新手。任何帮助表示赞赏。这是我试图实现的观点在此处输入图像描述

标签： xamarinmvvmxamarin.formsprismtabbedpage

解决方案

我发现我们应该添加AutowireViewModel页面的 XAML 来加载我们想要的视图模型：

xmlns:prism="clr-namespace:Prism.Mvvm;assembly=Prism.Forms"
prism:ViewModelLocator.AutowireViewModel="True"

通常，我们使用containerRegistry.RegisterForNavigation<>();将自定义视图模型绑定到某个视图。但是您在根标签页中放置了一个子标签页。这导致嵌套视图丢失了到相应视图模型的映射。添加后AutowireViewModel，此问题已修复。我们仍然可以使用RegisterForNavigation将您的自定义视图模型绑定到您的特殊视图，而不是自动命名对话。

这是一个简单的嵌套选项卡式页面的示例：https ://github.com/landl0526/PrismTabDemo 。请参阅它以获取更详细的代码。

此外，这仅适用于 Android 平台，因为 iOS 仅具有底部对齐的标签栏。

推荐阅读