WinUI 3点击按钮调用导航切换视图时应用崩溃如何解决

问题场景 #

在WinUI 3开发中，需要实现点击按钮将视图切换为SecondaryView的功能。使用Template Studio for WinUI模板搭建项目时发现：直接将视图切换逻辑写在页面构造函数中可以正常运行，但把逻辑放在Button Click点击事件函数中执行时，应用会直接崩溃。

相关复现代码 #

MainPage.xaml

<Grid x:Name="ContentArea">
   <TextBlock Text="Main Page"/>
   <Button Content="Press" Click="Button_Clicked"/>
</Grid>

MainPage.xaml.cs

private readonly INavigationService _navigationService;
public MainPage()
{
    ViewModel = App.GetService<MainViewModel>();
    InitializeComponent();
    _navigationService.NavigateTo(typeof(SecondaryViewModel).FullName); // 构造函数内调用正常
}

private void Button_Clicked(object sender, RoutedEventArgs e)
{
    _navigationService.NavigateTo(typeof(SecondaryViewModel).FullName); // 点击事件内调用崩溃
}

捕获到的异常相关代码

#if DEBUG && !DISABLE_XAML_GENERATED_BREAK_ON_UNHANDLED_EXCEPTION
     UnhandledException += (sender, e) =>
     {
          if (global::System.Diagnostics.Debugger.IsAttached) global::System.Diagnostics.Debugger.Break();
     };
#endif

问题原因 #

核心问题是你声明的_navigationService字段从未完成实例赋值。
构造函数内的导航代码没有触发崩溃，是因为调用时页面还未完成可视化树挂载，Template Studio自带的导航逻辑会静默拦截无效导航请求，没有触发空引用异常；等页面加载完成点击按钮时，调用未赋值的null实例会直接抛出空引用错误，导致应用崩溃。

修复方法 #

在MainPage构造函数中，和获取ViewModel的逻辑一致，从DI容器中获取INavigationService的实例赋值给对应字段即可，修改后的构造函数代码如下：

public MainPage()
{
    ViewModel = App.GetService<MainViewModel>();
    // 补全导航服务实例赋值
    _navigationService = App.GetService<INavigationService>();
    InitializeComponent();
    // 构造函数内的导航逻辑可按需保留或删除
    // _navigationService.NavigateTo(typeof(SecondaryViewModel).FullName);
}

补全赋值后，按钮点击事件中的导航代码就可以正常运行，不会再触发崩溃。
补充说明：该写法完全符合Template Studio的模板设计规范，不需要额外修改其他导航配置。

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