Razor: ViewComponent控件

已于 2022-12-06 17:27:13 修改
阅读量326 收藏
点赞数
分类专栏： c# 文章标签： 前端
于 2022-12-06 15:47:41 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/hellolianhua/article/details/128203670
版权

目标

想要在一个页面添加一个这样的板块，怎么做呢？

实现方法

 一

创建一个新的文件夹在Pages下 ViewComponent，在此文件夹下面创建一个cs文件

 注意Invoke（）的方法，根据Invoke方法的EmployeeCountByDept的相应的方法。

后端大概是这样

前端是这样的：

在原本的页面添加控件

<div class="col-sm-8">
        @await Component.InvokeAsync("HeadCount")
    </div>

 在此路劲下，添加一个cs页面

hellolianhua
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
在Razor页面中使用Razor Components(Blazor组件)
hhddzz的专栏
11-27 3496
一、注册Blazor服务、中间件 在Startup.cs文件相应位置添加以下语句 1、在ConfigureServices注入Blaozr服务 public void ConfigureServices(IServiceCollection services) { services.AddRazorPages(); services.AddServerSideBlazor(); //注册Blaozr服务 ..
一个从Razor Components生成HTML（例如，用于电子邮件）的库-.NET开发
05-27
从Razor组件生成HTML（例如，用于电子邮件）的库BlazorTemplater从Razor组件生成HTML（例如，用于电子邮件）的库。 示例ComponentRenderer使用一个流畅的界面。 让我们将MyComponent.razor呈现为HTML字符串。 字符串html =新的ComponentRenderer （）。使成为（）; 参数您可以在组件上设置参数：var model = new Model（）{Value =“ Test”}; var title =“ Test”; 字符串html =新的ComponentRenderer （）.Set（c => c.Model，model）.Set（c => c.Title，标题
asp.net mvc简单实现基于Razor的分页控件
dcnna0422的博客
10-24 231
最近在写一些web应用了解了一下asp.net mvc发现的确好用，所以直接就干上了。不过在使用asp.net mvc的Razor模板的情况并不向传统webform那样可以使用控件。但从Razor的功能上已经具备相关代替的功能，只是从Razor角度来说不是我们平常说的控件而是子模板。由于Razor可以根据自己需求把功能拆分到子模板中，然后通过RenderPage方法输出。从设计的手段上来...
Razor 组件
weixin_43542114的博客
06-07 1100
现在已设置好开发环境，接下来将探索 Blazor 项目的结构，并了解如何添加新页。什么是 Razor？ Razor 是一种标记语法，使用 HTML 和 C# 编写 Blazor Web 应用的 UI 组件。Razor 基于 ASP.NET，专为创建 Web 应用而设计。什么是 Razor 组件？ Razor 文件定义了构成部分应用 UI 的组件。 Blazor 中的组件类似于 ASP.NET Web Forms 中的用户控件。如果浏览项目，则会看到大部分文件为 .razor 文件。在编译时，每个 Razor
MVC razor 使用服务器控件
08-28 227
MVC调用服务器控件 MVC是不提倡使用服务器控件的，一贯摒弃原有的postback的方式。但是有时候发现现有的MVC扩展确实还没有到达需要的目的，原来asp.net的控件很好用，但在MVC中自己编写又太过麻烦，往往还需要编写很多的JS代码，如果在MVC中也能适当的使用服务器控件就太好了，例如treeview。在网上看到一篇类似的思路，很不错，记录下来。 在Controller...
Razor组件——路由
flyingdream123的专栏
08-09 703
路由 客户端路由可以通过使用@page指令装饰组件来在blazor中完成，如前面的示例中所示， //ParentComponent.razor @page "/parent-component" <h3> Parent Component</h3> <p>String in Parent: @parentString</p> <butt...
Razor扩展
无迹可寻
08-18 259
一、扩展IHtmlHelper 由于在Razor页面使用@Html.能够使用的自带方法有限，因此可以写一些扩展方法，例如扩展一个方法返回Html标签。 扩展方法是静态方法，且第一个参数是自身，用this修饰。 定义静态扩展方法，扩展IHtmlHelper类型，返回IHtmlContent类型 public static class HtmlHelperExtensions { public static IHtmlCo...
Razor,aspx的占位控件（母版页）
weixin_30607029的博客
11-02 109
1.razor： 母版页中：@*类似master的占位控件*@ @RenderSection("scripts", required: false)部分页中： @section scripts{ } 2.aspx： .master <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server"&gt...
微软动态html编辑控件,微软为 Visual Studio 推出新的 Razor 编辑器
weixin_42306002的博客
06-09 157
新酷产品第一时间免费试玩，还有众多优质达人分享独到生活经验，快来新浪众测，体验各领域最前沿、最有趣、最好玩的产品吧~！下载客户端还能获得专享福利哦！原标题：微软为 Visual Studio 推出新的 Razor 编辑器 来源：开源中国随着 Visual Studio 最新版本的发布，微软推出了一款新的 Razor 编辑器，用于使用 MVC、Razor Pages 和 Blazor 进行本地...
Asp.Net core 视图组件ViewComponent
极客神殿
02-08 636
视图组件 ViewComponent 最近用了一下视图组件，还挺方便的，如果遇到公共的部分，可以抽出来，写成视图组件，方便调用 先上图看一下效果：比如首页的4个画红框的地方是4个模块，有些地方可能要重复用到，那么我们用视图组件就很方便。 开始编码步骤 第一步，先新建一个项目 原项目中不是包含Components文件夹的，这个是我自己后加上的，创建好Web项目后，添加文件夹Components 第二步，添加视图组件类 创建类过程中，必须要以Name+ViewComponent.cs为规范，
ASP.NET Core 的 Razor 语法参考
allway2的博客
03-03 1837
作者：Rick Anderson、Taylor Mullen和Dan Vicarel Razor 是一种标记语法，用于将基于 .NET 的代码嵌入网页中。 Razor 语法由 Razor 标记、C# 和 HTML 组成。 包含 Razor 的文件通常具有.cshtml文件扩展名。 Razor 也可在Razor component文件 (.razor) 中找到。 Razor 语法类似于各种 JavaScript 单页应用程序 (SPA) 框架（如 Angular、React、VueJs 和 Sv...
Blazor入门笔记（5）-数据绑定
chinaherolts2008的博客
02-28 520
1.环境 VS2019 16.5.1 .NET Core SDK 3.1.200 Blazor WebAssembly Templates 3.2.0-preview2.20160.5 2.默认绑定 2.1.使用方法 Blazor中Razor组件通过一个名为@bind的HTML元素属性提供数据绑定功能，数据绑定的对象可以为字段、属性或表达式值。例如： <input @bind="_bindValue1" /> @code{ private int _bindValue1 { get; s
深入了解Blazor组件
寒冰屋的专栏
12-11 2416
本文着眼于组件的剖析、其生命周期以及Blazor在构建和运行UI时如何使用和管理组件。 对组件的深入理解使开发Blazor应用程序成为一种非常不同的体验。
ASP.NET 中获取html控件的值的方法
Kevin's life
12-29 7720
一、知识点： 1.name是用来提交数据的，提供给表单用，可以重复； 2.id则针对文档操作时候用，不能重复。如：document.getElementById()； document.getElementsByName(xxx); 取出的数组 document.getElementById(xxx); 取出是单个对象 3.ID是在客户端脚本里用!NAME是用于获取提交表单...
用javascript 获取Asp.Net 控件的值
StK
05-08 1248
找到后台控件的方法：document.getElementById('') Asp:Label innerText Asp:TextBox value
ASP.NET Core MVC之ViewComponents（视图组件）知多少？
weixin_34125592的博客
03-22 396
前言 大概一个来星期未更新博客了，久违了各位，关于SQL Server性能优化会和ASP.NET Core MVC穿插来讲，如果你希望我分享哪些内容可以在评论下方提出来，我会筛选并看看技术文档来对你的内容进行解答，借此希望我们能共同进步和学习。本节我们来讲讲ASP.NET Core  MVC中的视图组件。 Web应用程序下管理ViewComponents 我是奔着项目用到了哪些就会去写对应的...
razor组件设置属性(传递参数)，在被调用组件中呈显组件调用内容
flyingdream123的专栏
05-29 3520
Blazor 应用基于组件。Blazor 中的组件是指 UI 元素，例如，页面、对话框或数据输入窗体。组件处理用户事件，并定义灵活的 UI 呈现逻辑。组件可以嵌套和重用。 组件是内置于 .NET 程序集的 .NET 类，可以作为NuGet 包进行共享和分发。组件类通常以 Razor 标记页（文件扩展名为 .razor）的形式编写。 Razor Pages 和 MVC 也使用 Raz...
ASP.NET Core Razor 视图组件
zhuzhu81的博客
09-12 3372
视图组件简介 在新的ASP.NET Core MVC中，视图组件类似于局部视图，但它们更强大。视图组件不使用模型绑定，仅依赖于您在调用时提供的数据。 视图组件特性： 呈现页面响应的某一部分而不是整个响应 包括在控制器和视图之间发现的关注分离和可测试性优势 可以具有参数和业务逻辑 通常在页面布局中调用 视图组件是在任何地方可重用的呈现逻辑，对于局部视图来说相对复杂，例如： 动态导
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值