將ViewModel添加到移動視圖

我正在爲移動設備製作一組單獨的視圖，而不是爲手機使用其他自適應UI狀態。我可以通過在我的文件夾中添加一個名爲DeviceFamily-Mobile的子文件夾並添加一個新的View來實現此目的，該文件夾的名稱與我正在重寫的名稱相同。將ViewModel添加到移動視圖

我有以下View將工作，並顯示移動設備/模擬器上的「移動」。

<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>

但是，如果我嘗試設置DataContext讓我實際顯示一些有用的東西，就像這樣：

<Page.DataContext> 
    <viewModels:PayeesPageViewModel x:Name="ViewModel" /> 
</Page.DataContext>

然後我得到一個錯誤導航至PayeesPage時：

無法投射「Windows.UI.Xaml.Controls.TextBlock」類型的對象以鍵入「MyApp.ViewModels.PayeesPageViewModel」。

這與我在原始PayeesPage上設置DataContext的方法相同，它工作正常。有沒有其他方法可以在這些替代View上設置DataContext，還是我錯過了什麼？

來源

2016-07-05 dub stylee

事實證明，移動電話View需要與原始Page具有相同的x:Class。 ReSharper在我試圖將其稱爲MyApp.Views.PayeesPage時抱怨，因爲它已經存在，所以我將其更改爲MyApp.PayeesPage。但是，當我將它切換回來以便兩者都使用相同的x:Class時，一切都按預期開始工作。

不幸的是，我從ReSharper那裏得到了一堆紅色的漣漪，但事情正如他們應該的那樣工作。萬一有人遇到這個問題在未來：

查看/ PayeesPage.xaml：

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

查看/ DeviceFamily，移動/ PayeesPage.xaml：

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

來源

2016-07-05 18:54:23

THX爲了分享您的解決方案，有很多關於DeviceFamily-Type文件夾的文章，例如http://igrali.com/2015/08/02/three-ways-to-set-specific-devicefamily-xaml-views-in -uwp/ –

這是一個冰文章 - 我得到了很多我的信息。我的問題是，我發現的任何信息都沒有指出需要共享相同'x：Class'的視圖，因此在這種情況下，來自ReSharper的紅色波浪曲線有點誤導。 –

將ViewModel添加到移動視圖

回答

相關問題