.NET MAUI中如何向CommunityToolkit Popup传递数据？

方法1：通过构造函数直接传递 #

这是最直观的实现方式，自定义Popup时在构造函数中接收需要的数据，内部保存后即可在UI或业务逻辑中使用。

自定义Popup类 #

using CommunityToolkit.Maui.Views;

public class CustomPopup : Popup
{
    public string ReceivedData { get; }

    // 构造函数接收外部传入的数据
    public CustomPopup(string data)
    {
        ReceivedData = data;
        BindingContext = this;
        // 此处可添加UI初始化逻辑
    }
}

在页面中调用Popup并传递数据 #

// 传入数据并弹出Popup
var popup = new CustomPopup("需要传递给Popup的内容");
await this.ShowPopupAsync(popup);

Popup的XAML绑定示例 #

<toolkit:Popup xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
               xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
               xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
               x:Class="YourAppNamespace.CustomPopup">
    <VerticalStackLayout Padding="20">
        <Label Text="{Binding ReceivedData}" FontSize="18" />
    </VerticalStackLayout>
</toolkit:Popup>

方法2：通过BindingContext传递 #

如果页面已使用ViewModel，可以直接将Popup的BindingContext设置为页面的ViewModel，或者单独创建共享数据的ViewModel实例，让Popup直接绑定ViewModel中的属性。

页面ViewModel示例 #

using CommunityToolkit.Mvvm.ComponentModel;

public class MainPageViewModel : ObservableObject
{
    private string _sharedContent = "页面与Popup共享的数据";
    public string SharedContent
    {
        get => _sharedContent;
        set => SetProperty(ref _sharedContent, value);
    }
}

页面中打开Popup时绑定上下文 #

var pageViewModel = this.BindingContext as MainPageViewModel;
var popup = new CustomPopup();
popup.BindingContext = pageViewModel;
await this.ShowPopupAsync(popup);

Popup的XAML直接绑定属性 #

<toolkit:Popup xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
               xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
               xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
               x:Class="YourAppNamespace.CustomPopup">
    <VerticalStackLayout Padding="20">
        <Label Text="{Binding SharedContent}" />
        <Entry Text="{Binding SharedContent, Mode=TwoWay}" Placeholder="修改共享数据" />
    </VerticalStackLayout>
</toolkit:Popup>

方法3：使用CommunityToolkit.Mvvm的Messenger（消息传递） #

如果需要跨组件灵活传递数据，或者Popup与页面没有直接引用关系，可以用Messenger实现消息式数据传递。

定义消息类 #

using CommunityToolkit.Mvvm.Messaging.Messages;

public class PopupDataMessage : ValueChangedMessage<string>
{
    public PopupDataMessage(string value) : base(value)
    {
    }
}

页面发送数据消息 #

using CommunityToolkit.Mvvm.Messaging;

// 打开Popup前发送数据
WeakReferenceMessenger.Default.Send(new PopupDataMessage("通过消息传递的数据"));
var popup = new CustomPopup();
await this.ShowPopupAsync(popup);

Popup接收并处理消息 #

using CommunityToolkit.Maui.Views;
using CommunityToolkit.Mvvm.Messaging;

public class CustomPopup : Popup
{
    public CustomPopup()
    {
        // 注册消息接收
        WeakReferenceMessenger.Default.Register<PopupDataMessage>(this, (recipient, message) =>
        {
            var receivedData = message.Value;
            // 切换到UI线程更新界面
            Dispatcher.Dispatch(() =>
            {
                // 此处添加UI更新逻辑，比如给Label赋值
            });
        });
    }

    // Popup关闭时取消注册，避免内存泄漏
    protected override void OnDisappearing()
    {
        WeakReferenceMessenger.Default.Unregister<PopupDataMessage>(this);
        base.OnDisappearing();
    }
}

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