WinUI 3桌面应用ContentDialog的XamlRoot关联异常问题

问题根源 #

你遇到的错误是因为在页面构造函数中执行数据操作并触发对话框时，页面还未完全加载到可视化树中，this.Content.XamlRoot可能处于未初始化或不稳定状态。此时创建的ContentDialog关联的XamlRoot，和后续页面正式加载后的XamlRoot产生冲突，导致"元素已关联到其他XamlRoot"的错误。

另外，async void类型的方法在构造函数中调用会脱离构造函数的同步上下文，异步操作的执行时机无法和页面加载状态对齐，进一步加剧了这个问题。

修复步骤 #

1. 把数据加载逻辑移到页面Loaded事件中 #

构造函数只负责初始化控件，不要执行耗时的SQL操作或调用异步对话框。将数据获取代码移到Loaded事件处理方法中：

public YourPage()
{
    InitializeComponent();
    // 构造函数仅做初始化，数据加载逻辑移至Loaded事件
    this.Loaded += YourPage_Loaded;
}

private async void YourPage_Loaded(object sender, RoutedEventArgs e)
{
    try
    {
        // 在这里执行SQL数据获取操作，比如GetSQLData_App_View_Results_2020
        await GetSQLData_App_View_Results_2020();
    }
    catch (Exception ex)
    {
        Debug.WriteLine($"Error: {ex.Message}");
        await DisplayErrorDialog($"GetSQLData_App_View_Results_2020: {ex.Message}");
    }
}

2. 改进DisplayErrorDialog方法 #

将方法改为async Task类型（避免async void的潜在问题），并确保XamlRoot的获取可靠：

private async Task DisplayErrorDialog(string content)
{
    var errorDialog = new ContentDialog()
    {
        Title = "* Error *",
        Content = content,
        CloseButtonText = "Ok"
    };

    // 确保XamlRoot有效，优先使用窗口的Content.XamlRoot
    if (errorDialog.XamlRoot == null)
    {
        errorDialog.XamlRoot = Window.Current.Content.XamlRoot;
    }

    await errorDialog.ShowAsync();
}

3. 后台线程异常需切换至UI线程处理 #

如果SQL操作在后台线程执行，触发异常后要切换回UI线程再调用对话框：

catch (SqlException sqlError)
{
    Debug.WriteLine($"Hello SQL error GetSQLData_App_View_Results_2020: {sqlError.Message}");
    // 切换到UI线程执行对话框调用
    await DispatcherQueue.EnqueueAsync(async () =>
    {
        await DisplayErrorDialog($"GetSQLData_App_View_Results_2020 (SQL Error): {sqlError.Message}");
    });
}

额外提示 #

• WinUI3中所有UI操作（包括显示ContentDialog）必须在UI线程执行，后台线程触发的异常需通过DispatcherQueue切换上下文。
• 避免在构造函数、InitializeComponent之后立即执行异步操作，等待页面Loaded事件是更安全的时机。

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