.net 8新预览版使用 blazor 组件进行服务器端呈现(项目体验)-kb88凯时官网登录

来自:网络
时间:2024-06-10
阅读:

简介

此预览版添加了对使用 blazor 组件进行服务器端呈现的初始支持。这是 blazor 统一工作的开始,旨在使 blazor 组件能够满足客户端和服务器端的所有 web ui 需求。这是该功能的早期预览版,因此仍然受到一定限制,但我们的目标是无论选择如何构建应用,都能使用可重用的 blazor 组件。

服务器端呈现 (ssr) 是指服务器生成 html 以响应请求。使用 ssr 的应用加载速度很快,因为渲染 ui 的所有艰苦工作都在服务器上完成,而无需下载大型 javascript 捆绑包。asp.net core 对带有 mvc 和 razor 页面的 ssr 现有支持,但这些框架缺乏用于构建可重用的 web ui 片段的组件模型。这就是开拓者的用武之地!我们正在添加对使用 blazor 组件生成服务器呈现的 ui 的支持,这些组件也可以扩展到客户端以实现丰富的交互性。

在此预览版中,可以使用 blazor 组件执行服务器端呈现,而无需任何 .cshtml 文件。框架将发现可路由的 blazor 组件,并将其设置为终结点。不涉及 webassembly 或 websocket 连接。你不需要加载任何javascript。每个请求由相应终结点的 blazor 组件独立处理。

项目体验

首先需要安装 .net 8预览版最新版

1.创建一个空的 asp.net core web app:

dotnet new web -o webapp
cd webapp

2.在项目中添加一个简单的razor组件:

dotnet new razorcomponent -n mycomponent

更新mycomponent.razor内容,将其变成一个带有路由的合适的html页面;

@page "/"
@implements irazorcomponentapplication

    
    

the time is @datetime.now.toshorttimestring()

你还需要在这个组件上实现接口irazorcomponentapplication,该接口目前用于帮助发现应用程序中的组件端点。这个设计可能会在以后的更新中改变,但目前这个接口是必需的。

4.在program.cs中通过调用.addrazorcomponents()设置razor组件服务

builder.services.addrazorcomponents();

5.通过调用映射组件的端点。你需要为你的组件添加一个using指令:maprazorcomponents()

app.maprazorcomponents();

可路由组件将自动在所驻留的程序集中发现。再次注意,当前必须实现,但此设计可能会在以后的更新中更改。mycomponenttcomponentirazorcomponentapplication

6.运行应用程序并浏览到应用程序根目录查看你的组件渲染

.net 8新预览版使用 blazor 组件进行服务器端呈现(项目体验)

但是似乎无法交互,我在使用了点击事件但是没法触发了

修改mycomponent.razor文件代码

@page "/"
@implements irazorcomponentapplication

    
    

the time is @datetime.now.toshorttimestring()

counter: @counter

@code { private int counter = 0; private void onclick() { counter ; } }

运行效果:

.net 8新预览版使用 blazor 组件进行服务器端呈现(项目体验)

当我们点击按钮并不会触发事件!可能是需要写js去完成,欢迎大佬一块讨论讨论新的技术

返回顶部
顶部
网站地图