Xaml 将ViewModel添加到移动视图

我正在为移动设备创建一组单独的视图，而不是为手机使用其他自适应UI状态。我可以通过在我的

视图

文件夹中添加名为

DeviceFamily Mobile

的子文件夹，并添加一个新的

视图

，其名称与我覆盖的视图相同

我有以下

视图

，可以在移动设备/模拟器上工作并显示“MOBILE”

<Page x:Class="MyApp.PayeesPage"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:behaviors="using:Template10.Behaviors"
      xmlns:controls="using:Template10.Controls"
      xmlns:core="using:Microsoft.Xaml.Interactions.Core"
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
      xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
      xmlns:models="using:MyApp.Models"
      xmlns:viewModels="using:MyApp.ViewModels"
      xmlns:views="using:MyApp.Views"
      mc:Ignorable="d">

    <RelativePanel Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <TextBlock x:Name="MobileTextBlock"
                   Foreground="{ThemeResource ForegroundColorBrush}"
                   Text="MOBILE" />
    </RelativePanel>
</Page>

然后，我在导航到

PayesPage

时出错：

无法将类型为“Windows.UI.Xaml.Controls.TextBlock”的对象强制转换为类型为“MyApp.ViewModels.PayesPageViewModel”

---

这与我在原始的

payesPage

上设置

DataContext

的方式相同，它工作正常。是否有其他方法在这些备用

视图上设置
数据上下文
，或者我遗漏了什么？
结果是，移动
视图
需要与原始
页面
具有相同的
x:Class
。当我尝试调用它时，ReSharper正在抱怨
MyApp.Views.payesPage
，因为它已经存在，所以我将它更改为
MyApp.payesPage
。然而，当我将其切换回原来的状态，以便两者都使用相同的
x:Class
时，一切都开始按预期工作

不幸的是，我从ReSharper那里得到了一堆红色的曲线，但一切都正常运转。以防将来有人遇到这个问题：

查看/payespage.xaml:

<Page x:Class="MyApp.Views.PayeesPage"
 ...>

<Page x:Class="MyApp.Views.PayeesPage"
 ...>



Views/DeviceFamily Mobile/payespage.xaml:

<Page x:Class="MyApp.Views.PayeesPage"
 ...>

<Page x:Class="MyApp.Views.PayeesPage"
 ...>

事实证明，移动
视图需要与原始
页面具有相同的
x:Class
。当我尝试调用它时，ReSharper正在抱怨
MyApp.Views.payesPage
，因为它已经存在，所以我将它更改为
MyApp.payesPage
。然而，当我将其切换回原来的状态，以便两者都使用相同的
x:Class
时，一切都开始按预期工作

不幸的是，我从ReSharper那里得到了一堆红色的曲线，但一切都正常运转。以防将来有人遇到这个问题：

查看/payespage.xaml:

<Page x:Class="MyApp.Views.PayeesPage"
 ...>

<Page x:Class="MyApp.Views.PayeesPage"
 ...>



Views/DeviceFamily Mobile/payespage.xaml:

<Page x:Class="MyApp.Views.PayeesPage"
 ...>

<Page x:Class="MyApp.Views.PayeesPage"
 ...>


thx为了分享您的解决方案，有很多文章都在谈论DeviceFamily Type文件夹，例如，这是一篇很好的文章，我从中获得了很多信息。我的问题是，我发现的信息中没有一条指出视图需要共享相同的
x:Class
，因此，在这种情况下，来自ReSharper的红色曲线有点误导。thx关于共享您的解决方案，有很多文章讨论DeviceFamily Type文件夹，例如，这是一篇很好的文章，我从中获得了很多信息。我的问题是，我发现的所有信息都没有指出视图需要共享相同的
x:Class
，因此在这种情况下，ReSharper的红色曲线有点误导。