Blazor Web APP学习记录

发布于:2024-10-11 ⋅ 阅读:(15) ⋅ 点赞:(0)

1 呈现模式

参见:https://learn.microsoft.com/zh-cn/aspnet/core/blazor/components/render-modes?view=aspnetcore-8.0
Blazor Web App 中的每个组件会采用呈现模式来确定其使用的托管模型、呈现位置以及它是否是交互式的,主要的呈现模式为以下4种:

1.1 静态SSR

静态服务器端呈现,静态页面,无任何交互。

1.2 服务器端交互SSR

组件中定义@rendermode InteractiveServer或使用组件时进行指定@rendermode=“InteractiveServer或RenderMode.InteractiveServerRenderMode.InteractiveServer”

1.3 客户端交互CSR

组件中定义@rendermode InteractiveWebAssembly或使用组件时指定@rendermode=“InteractiveWebAssembly或RenderMode.InteractiveServerRenderMode.InteractiveWebAssembly”

1.4 自动交互式

下载 Blazor 捆绑包后,在后续访问时先使用 Blazor Server 然后使用 CSR 的交互式 SSR。
先服务器,后客户端。
组件中定义@rendermode InteractiveAuto

1.5 注意

1.呈现模式不可交叉使用,比如服务器端交互的父组件不可使用客户端交互的子组件;
2.呈现模式不指定的情况下,会继承父组件的呈现模式;

2 Blazor Web APP项目

新建的Blazor Web APP项目,选择呈现模式为“自动交互式”,项目结构如下:
在这里插入图片描述
“.Client”部分:使用交互式 WebAssembly 或交互式自动呈现模式的组件必须位于 .Client 项目中。
注意:
1.界面可存放在主项目中的“Components/Pages”或“.Client”项目下的“Pages”中,若这两个目录下存在同样导航的界面,则无法定位到相应界面;
2.服务器项目的 Components 文件夹用于保存应用的服务器端 Razor 组件。 共享组件通常放置在 Components 文件夹的根目录中(最好在主项目中),而布局和页面组件通常放置在 Components 文件夹内的文件夹中,共享组件不要在组件中定义呈现模式,应在使用时定义或继承;

3 会话状态

参见:https://learn.microsoft.com/zh-cn/aspnet/core/blazor/state-management?view=aspnetcore-8.0&pivots=server

Blazor WebAssembly和Blazor Server不同且不共用,需要根据项目类型分别进行设置,目前暂时限制Blazor Web APP的使用。