Blazor条件切换组件时如何避免OnInitialized系列方法重复执行

你遇到的重复执行初始化生命周期的问题，本质是if/else条件渲染会在条件不满足时直接销毁对应组件实例，下次条件命中时会创建全新的组件实例，所以OnInitialized、OnInitializedAsync会重新执行。以下是可落地的解决方案：

方案1：使用CSS显隐代替条件渲染（全版本兼容） #

不销毁组件实例，仅通过样式控制是否可见，组件只会在第一次渲染时执行一次初始化逻辑。
代码示例：

<div class="row full-height">
   <div class="col-md-12">
      <Component1 Parameter="foo" style="@(condition ? "display:block;" : "display:none;")" />
      <Component2 Parameter="bar" style="@(!condition ? "display:block;" : "display:none;")" />
   </div>
</div>

注意：该方案会在首次加载时同时渲染两个组件，适合组件本身渲染开销不大的场景

方案2：使用.NET 8+ 内置<KeepAlive>组件（推荐，改动最小） #

.NET 8 新增的<KeepAlive>组件可以缓存被包裹的组件实例，即使条件切换导致组件从渲染树中移除，实例也不会被销毁，切回时直接复用缓存实例，不会重新触发初始化生命周期。
代码示例：

<div class="row full-height">
   <div class="col-md-12">
      <KeepAlive>
         @if (condition)
         {
            <Component1 Parameter="foo"></Component1>
         }
         else
         {
            <Component2 Parameter="bar"></Component2>
         }
      </KeepAlive>
   </div>
</div>

方案3：初始化逻辑上移到父组件缓存 #

如果你的.NET版本低于8，且两个组件渲染开销较大，不适合同时渲染，可以将原本写在子组件初始化方法中的逻辑迁移到父组件中执行，执行结果缓存后通过组件参数传递给子组件。子组件即使销毁重建，也可以直接使用父组件缓存好的结果，不需要重复执行初始化逻辑。

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