如何优雅地为.NET MAUI FlyoutItem加载时传递参数？

你的当前方案依赖嵌套的CurrentItem获取路由，不仅代码冗余，还和路由强耦合——一旦路由规则修改，逻辑就会失效。以下是几种更优雅的实现方式：

1. 使用QueryProperty特性直接绑定ViewModel参数 #

这是最贴合.NET MAUI Shell设计的方案，通过路由参数自动将值注入ViewModel，无需在Page中手动处理导航事件。

步骤： #

• 在ViewModel中添加QueryProperty特性，指定参数名称和对应的路由键：

using CommunityToolkit.Mvvm.ComponentModel;

public partial class SharedViewModel : ObservableObject
{
    [QueryProperty(nameof(ContentParam), "contentParam")]
    private string _contentParam;
    public string ContentParam
    {
        get => _contentParam;
        set
        {
            if (SetProperty(ref _contentParam, value) && !string.IsNullOrEmpty(value))
            {
                // 参数更新时自动执行查询逻辑
                _ = SearchQueryAsync(value);
            }
        }
    }

    public async Task SearchQueryAsync(string param)
    {
        // 你的API调用、内容加载逻辑
    }
}

• 在AppShell的XAML中，给每个ShellContent的路由添加参数：

<FlyoutItem Title="分类1">
    <ShellContent ContentTemplate="{DataTemplate local:SharedPage}" 
                  Route="category-page?contentParam=category1" />
</FlyoutItem>
<FlyoutItem Title="分类2">
    <ShellContent ContentTemplate="{DataTemplate local:SharedPage}" 
                  Route="category-page?contentParam=category2" />
</FlyoutItem>

优点： #

• 完全遵循Shell导航规范，ViewModel自动接收参数
• Page无需重写OnNavigatedTo，代码更简洁
• 参数传递逻辑和UI解耦

2. 自定义ShellContent附加属性 #

如果不想将参数和路由耦合，可以通过自定义附加属性存储参数，在Page中读取后传递给ViewModel。

步骤： #

• 定义附加属性类：

public static class ShellContentParams
{
    public static readonly BindableProperty ContentParameterProperty =
        BindableProperty.CreateAttached(
            "ContentParameter", 
            typeof(string), 
            typeof(ShellContentParams), 
            null);

    public static string GetContentParameter(BindableObject obj)
    {
        return (string)obj.GetValue(ContentParameterProperty);
    }

    public static void SetContentParameter(BindableObject obj, string value)
    {
        obj.SetValue(ContentParameterProperty, value);
    }
}

• 在AppShell的XAML中给ShellContent设置属性：

<FlyoutItem Title="分类1">
    <ShellContent ContentTemplate="{DataTemplate local:SharedPage}" 
                  local:ShellContentParams.ContentParameter="category1" />
</FlyoutItem>
<FlyoutItem Title="分类2">
    <ShellContent ContentTemplate="{DataTemplate local:SharedPage}" 
                  local:ShellContentParams.ContentParameter="category2" />
</FlyoutItem>

• 在Page的OnNavigatedTo中读取属性并传递给ViewModel：

protected override async void OnNavigatedTo(NavigatedToEventArgs args)
{
    if (Shell.Current.CurrentItem is FlyoutItem flyoutItem 
        && flyoutItem.CurrentItem is ShellContent shellContent)
    {
        var param = ShellContentParams.GetContentParameter(shellContent);
        if (!string.IsNullOrEmpty(param))
        {
            await Vm.SearchQueryAsync(param);
        }
    }
    base.OnNavigatedTo(args);
}

优点： #

• 参数与路由完全解耦，路由可独立修改
• 参数定义直观，在XAML中一目了然

3. 监听Shell CurrentItem变化事件 #

将参数传递逻辑集中在AppShell中，Page无需处理任何导航逻辑。

步骤： #

• 在AppShell构造函数中订阅CurrentItemChanged事件：

public AppShell()
{
    InitializeComponent();
    CurrentItemChanged += OnShellCurrentItemChanged;
}

private async void OnShellCurrentItemChanged(object sender, EventArgs e)
{
    if (CurrentItem is FlyoutItem flyoutItem 
        && flyoutItem.CurrentItem is ShellContent shellContent)
    {
        // 从ShellContent的Tag获取参数（也可以用上面的自定义附加属性）
        var param = shellContent.Tag as string;
        if (param != null && shellContent.Content is SharedPage page)
        {
            await page.Vm.SearchQueryAsync(param);
        }
    }
}

• 在XAML中给ShellContent设置Tag：

<FlyoutItem Title="分类1">
    <ShellContent ContentTemplate="{DataTemplate local:SharedPage}" Tag="category1" />
</FlyoutItem>
<FlyoutItem Title="分类2">
    <ShellContent ContentTemplate="{DataTemplate local:SharedPage}" Tag="category2" />
</FlyoutItem>

优点： #

• 所有参数传递逻辑集中在Shell层，Page保持纯净
• 适合参数逻辑复杂、需要集中管理的场景

内容的提问来源于stack exchange，提问作者Angelru