.NET MAUI中如何传递列表点击对象并在另一页面读取显示
问题描述
现有以下C#类定义:
public class Book { public string Title { get; set; } public string Author { get; set; } public int PageCount { get; set; } }
public class Bookshelf { public List<Book> Books { get; set; } }
将Bookshelf中的3个Book对象绑定到CollectionView后,在ViewModel中通过如下RelayCommand处理列表项点击事件,已实现将点击的Book对象传递到BookPage:
[RelayCommand] async Task BookClicked() { try { var navigationParameter = new Dictionary<string, object> { { "Book", book } }; await Shell.Current.GoToAsync($"{nameof(BookPage)}", navigationParameter); } catch (Exception ex) { Debug.WriteLine(ex.Message); } }
请问如何在BookPage中获取传递过来的Book对象,并在页面上展示它的内容?
解决方案
方法一:使用QueryProperty特性(推荐)
这是MAUI Shell导航中接收参数最简洁的方式:
- 在
BookPage对应的ViewModel中添加QueryProperty特性,指定参数名称和对应属性:
public class BookPageViewModel : ObservableObject { private Book _selectedBook; public Book SelectedBook { get => _selectedBook; set => SetProperty(ref _selectedBook, value); } // 第一个参数是导航传递的参数键名,需和"Book"一致;第二个是ViewModel中绑定的属性名 [QueryProperty(nameof(SelectedBook), "Book")] public BookPageViewModel() { } }
- 在
BookPage的XAML中绑定SelectedBook的属性到UI元素:
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:vm="clr-namespace:YourAppNamespace.ViewModels" x:Class="YourAppNamespace.Views.BookPage" Title="Book Details"> <ContentPage.BindingContext> <vm:BookPageViewModel /> </ContentPage.BindingContext> <VerticalStackLayout Padding="20"> <Label Text="Title:" FontAttributes="Bold" /> <Label Text="{Binding SelectedBook.Title}" FontSize="Large" Margin="0,0,0,10"/> <Label Text="Author:" FontAttributes="Bold" /> <Label Text="{Binding SelectedBook.Author}" FontSize="Medium" Margin="0,0,0,10"/> <Label Text="Page Count:" FontAttributes="Bold" /> <Label Text="{Binding SelectedBook.PageCount}" FontSize="Medium"/> </VerticalStackLayout> </ContentPage>
方法二:在页面导航生命周期中直接获取参数
如果不需要通过ViewModel处理,可直接在页面代码中提取参数:
- 在
BookPage.xaml.cs中重写OnNavigatedTo方法,提取导航参数:
public partial class BookPage : ContentPage { public BookPage() { InitializeComponent(); } protected override void OnNavigatedTo(NavigatedToEventArgs args) { base.OnNavigatedTo(args); // 从导航参数中解析Book对象 if (Navigation.Parameter is Dictionary<string, object> parameters && parameters.TryGetValue("Book", out var bookObj) && bookObj is Book book) { // 直接给UI元素赋值 TitleLabel.Text = book.Title; AuthorLabel.Text = book.Author; PageCountLabel.Text = book.PageCount.ToString(); } } }
- 对应的XAML需要给UI元素命名:
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="YourAppNamespace.Views.BookPage" Title="Book Details"> <VerticalStackLayout Padding="20"> <Label Text="Title:" FontAttributes="Bold" /> <Label x:Name="TitleLabel" FontSize="Large" Margin="0,0,0,10"/> <Label Text="Author:" FontAttributes="Bold" /> <Label x:Name="AuthorLabel" FontSize="Medium" Margin="0,0,0,10"/> <Label Text="Page Count:" FontAttributes="Bold" /> <Label x:Name="PageCountLabel" FontSize="Medium"/> </VerticalStackLayout> </ContentPage>
内容的提问来源于stack exchange,提问作者eengstroem
相关产品推荐
相关产品推荐

