目的:
组件生命周期是Blazor工程开发中必然会接触的概念,如果开发者不能明确组件的生命周期的话,一方面无法很好地理解和优化程序,另外很多功能的实现方面也会有阻力。学好组件生命周期是开发组件的基础。 本文将着重讲解一些组件生命周期的使用技巧,对于组件生命周期的完整解读请参考: blog.csdn.net/playermaker… ;
组件基类:
ComponentBase类是所有组件的基类,意味着我们自定义的组件是默认包含各种生命周期函数的,如OnInitialized、OnParametersSet等;
生命周期函数执行顺序
生命周期函数使用方法
假设有一个自定义的razor组件,无论它是布局组件、页面组件还是基本的控件组件,都可以通过重载生命周期函数来在该组件生成的各个阶段添加自定义的代码,以此达到各种神奇的功能;
下图是在某页面组件的初始化阶段判断用户是否是已登录状态的示例:
在VS2022中添加重载函数很简单,只要键入overrride再按下空格,就能出现可重载的函数列表,如:
根据需要重载生命周期函数,是活用组件生命周期的主要手段;
组件刷新
组件刷新在Blazor是很重要的一个机制,其和生命周期函数中的ShouldRender和StateHasChanged函数几乎直接相关。
Blazor组件是有局部刷新机制的,也就是程序运行的每一周期中,并不是所有画面图形都重新渲染,只有检测到存在改动的情况下才会局部渲染。这个局部的界限通常以组件为基础。
对于Blazor工程整体来讲,组件是呈树状结构排列,层层包含的,例如通常布局组件就是页面组件的父组件,页面组件又通常是控件组件的父组件。那么局部刷新是如何实现的呢?这个时候就用到了ShouldRender和StateHasChanged函数。
严格来讲ShouldRender和StateHasChanged函数不是生命周期函数,他们是在各生命周期函数执行过程中的一个小条件分支。
当StateHasChanged函数调用的时候,其内部会调用ShouldRender,返回为true的时候代表当前组件内容存在改动,需要重新渲染(也就是刷新);如果返回false,则不重新渲染;
默认情况下,结合个人使用经验,StateHasChanged函数通常会在触发事件或页面切换的时候执行,例如按钮点击等,而没有什么契机的话它也不执行;
以工程自带的计数页面举例,为什么点击Click me按钮时Current count会显示加一呢?就是因为触发了点击事件,且就是当前组件发生的,框架觉得可能有什么内容改变了,就执行一下StateHasChanged,如果有改变那么就刷新一下,没有就不动。该页面代码如下:
看起来很合理,但是会有一种情况就是对于blazor前端工程来讲并没有任何契机的情况下,后台的某些数据变化了,但是即使前端绑定了该数据变量,其也不会自动刷新;
例如建立一个静态类,该类存在string title变量,该变量在标题栏中引用。在标题栏以外的某个组件中设定条件,使title变量的值改变。该组件和标题栏组件没有任何关系,不是父子组件。那么你会发现title的文本不会因为一个不可知的后台数据改变而改变。这个时候怎么办?答案肯定是调用标题栏组件的StateHasChanged函数。但是怎么调用?在这先不做详解,留作思考....
以上就是对Blazor组件生命周期及使用技巧的介绍。