Blazor按钮点击触发全生命周期方法重复执行问题排查

问题现象 #

点击按钮触发onclick调用CheckSchedule方法后，页面所有生命周期方法（包括OnInitializedAsync）被重复执行，原本初始化好的列表被意外重置。

问题原因 #

当按钮被包裹在原生HTML<form>标签内时，点击按钮会触发表单的默认提交行为，这会导致Blazor组件重新初始化，进而触发所有生命周期方法从头执行，包括OnInitializedAsync，最终造成列表数据被重置。

解决方案 #

直接移除包裹按钮的HTML<form>标签即可解决该问题。Blazor的交互逻辑不需要依赖原生表单提交，移除后按钮的点击事件只会触发指定的CheckSchedule方法，不会触发组件的重新初始化。

内容的提问来源于stack exchange，提问作者Karl Christian Gutierrez Abant