Question

在HubPage部分中定义视图以绑定到相应的ViewModel所需的流程是什么？

<Hub Header="{Binding HubHeader}" >
    <HubSection x:Name="NewestOffers" Header="{Binding NewestOffersHeader}" IsHeaderInteractive="True" >
        <DataTemplate >
            <local:NewestOffersView DataContext="{Binding NewestOffers}"/>
        </DataTemplate>
    </HubSection>

    <HubSection Header="{Binding SearchHeader}" IsHeaderInteractive="True" >
        <DataTemplate x:Name="SearchView">
            <local:SearchView/>
        </DataTemplate>
    </HubSection>

    <HubSection Header="{Binding AddOfferHeader}" IsHeaderInteractive="True" >
        <DataTemplate>
            <local:AddOfferView/>
        </DataTemplate>
    </HubSection>

    <HubSection Header="{Binding AccountHeader}" IsHeaderInteractive="True">
        <DataTemplate>
            <local:AccountView/>
        </DataTemplate>
    </HubSection>
</Hub>

我已经创建了所有的ViewModel，例如NewestOffersViewModel，SearchViewModel等，但它并没有被绑定。我并没有忘记在容器配置中注册它们。

@Edit：包含集线器的页面的视图模型：

public class MainPageViewModel : PropertyChangedBase
{
    public string HubHeader
    {
        get { return "Second Hand Bookshop"; }
    }
    public SearchViewModel SearchView { get; set; }
    public NewestOffersViewModel NewestOffersViewModel { get; set; }
    public MainPageViewModel()
    {
        SearchView = new SearchViewModel();
        NewestOffersViewModel = new NewestOffersViewModel();
    }
    public string SearchSectionHeader
    {
        get { return "Search"; }
    }

和MainPageView（我试图将NewestOffersView绑定到NewestOffersViewModel）。

 <Hub Header="{Binding HubHeader}" >
    <HubSection Header="{Binding NewestOffersHeader}" IsHeaderInteractive="True" >
        <DataTemplate >
            <ContentControl  x:Name="NewestOffersViewModel" />
        </DataTemplate>
    </HubSection>

Answer 1

好的，所以我得到了这个工作。 MainPageView：

<Hub Header="{Binding HubHeader}" >
    <HubSection Header="{Binding NewestOffersHeader}" IsHeaderInteractive="True" >
        <DataTemplate >
            <local:NewestOffersView  DataContext="{Binding NewestOffersViewModel}" />
        </DataTemplate>
    </HubSection>

    <HubSection Header="{Binding SearchHeader}" IsHeaderInteractive="True" >
        <DataTemplate x:Name="SearchView">
            <local:SearchView DataContext="{Binding SearchViewModel}"/>
        </DataTemplate>
    </HubSection>

    <HubSection Header="{Binding AddOfferHeader}" IsHeaderInteractive="True" >
        <DataTemplate>
            <local:AddOfferView DataContext="{Binding AddOfferViewModel}"/>
        </DataTemplate>
    </HubSection>

    <HubSection Header="{Binding AccountHeader}" IsHeaderInteractive="True">
        <DataTemplate>
            <local:AccountView DataContext="{Binding AccountViewModel}"/>
        </DataTemplate>
    </HubSection>
</Hub>

MainPageViewModel：

 public class MainPageViewModel : PropertyChangedBase
{
    public string HubHeader
    {
        get { return "Second Hand Bookshop"; }
    }
    public SearchViewModel SearchViewModel { get; set; }
    public NewestOffersViewModel NewestOffersViewModel { get; set; }
    public AddOfferViewModel AddOfferViewModel { get; set; }
    public AccountViewModel AccountViewModel { get; set; }
    public MainPageViewModel()
    {
        SearchViewModel = new SearchViewModel();
        NewestOffersViewModel = new NewestOffersViewModel();
        AddOfferViewModel = new AddOfferViewModel();
        AccountViewModel = new AccountViewModel();
    }

现在看来显而易见但早些时候我认为视图将以与MainPageView相同的自动方式解析。

@Henk Holterman说

在DataTemplate中使用UserControl会让我失望。

但我无法使内容控件的版本工作...抱歉。 XD

使用CaliburnMicro在HubPage中进行ViewModel绑定

1 个答案: