问题标签 [razor-components]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
2907 浏览

.net - Asp.net core 3.1 找不到要渲染的 Razor 组件

我试图将 Blazor 集成到现有的 asp.net core 3.1 应用程序中。我看过的所有教程都说,在 web 项目中进行正确设置后,您应该能够在任何 cshtml 文件中执行此操作:

但相反,我得到了这个: 在此处输入图像描述

找不到类型或命名空间“HelloComponent”。

我做了什么

1) 在我的 Startup.cs 中添加了以下内容

2) 将 _Imports.razor 文件添加到 /Pages 文件夹

3) 添加了仅包含一些文本的新 Razor 组件。

在此处输入图像描述

4) 添加到_Layout.cshtml

0 投票
1 回答
401 浏览

chart.js - 如何使用饼图创建多个组件?

我正在构建一个 .NET Core Web 应用程序。我的目标是构建一个包含饼图的 Razor 组件,然后在我的项目中通过不同的数据输入重新使用该组件。问题是我无法在组件内添加配置每个饼图所需的脚本。

这是组件的外观:

这是我认为调用该组件的代码:

如果只有一个组件,这一切都很好,但我似乎无法找到一种方法让它与多个组件一起工作。

我在脚本标签中为每个饼图需要以某种方式更改的 3 个属性添加了注释。

我还找到并尝试了 mariusmuntean 的 Chart.Js Blazor 库,但我无法让它工作。我认为它没有为我显示任何图表,因为它需要在 Blazor 项目中使用,而不是在 .NET Core MVC 中使用?

只要我在 Razor 组件内创建饼图,任何类型的解决此问题的方法都是受欢迎的。

0 投票
1 回答
3310 浏览

asp.net-core - Razor 组件与视图组件

我最近从 Asp .NET Core 2.2 升级到 3.1,可以在 razor 页面中使用 Razor 组件。它们看起来基本上像视图组件,除了它使用 blazor 和同一文件中的所有内容。我试图搜索,但我没有阅读任何关于使用 Razor 组件而不是查看组件的文档。

那么问题来了……

在 Razor 页面中使用 Razor 组件而不是查看组件有什么意义?这个会比较好吗?我知道视图组件设置起来有点痛苦,因为您必须设置默认视图和带有逻辑的代码隐藏文件,并且您不能在其上使用 javascript,只能在父视图上使用。我的大多数应用程序都充满了视图组件,我想知道切换到剃须刀组件有什么好处?

0 投票
1 回答
379 浏览

c# - 剃刀组件中的“typeparam”语法错误 - blazor

当前一个的父组件为类型 提供剩余部分时,现在拥有这个TModel带有参数参数的剃刀通用组件,因此我无法传递表达式!Expression<Func<TModel,object>>[]TModelWorkOrderExpression<Func<TModel,object>>TModelWorkOrder

代码

DataGridComponent.razor.cs

SomeViewModel.razor

它显示了转换正则语法错误

无法隐藏表达式.... WorkOrder to ... TModel

更多技术细节

  • ASP.NET 核心版本:3.1
  • IDE(VS 16.4 prev. 4)
0 投票
1 回答
6334 浏览

asp.net - Blazor 组件参数不应设置在其组件之外

我正在学习 Blazor。我没有基于组件的编程经验。

我有两个组件: aDateRangePicker和 a RadzenCheckBox

现在,要求很简单。如果单击该复选框,则显示两个日历,如果未选中则显示一个日历。

我写了以下代码:

这工作正常。

但我得到一个警告:

不应在其组件之外设置组件参数“ShowOnlyOneCalendar”。

我已经阅读了一些有关此警告的博客,其中建议建立父子组件关系以进行组件之间的通信。但这些不是父母和孩子。

我究竟做错了什么?实现此类要求且没有此警告的最佳方法是什么?

0 投票
1 回答
58 浏览

asp.net - 使用@page Route Template 会破坏 razor 页面中的 razor 组件

我有以下剃须刀页面 Index.cshtml:

索引.cshtml.cs:

使用 razor 组件 Test.razor:

当我调用没有值的页面时,例如:

https://localhost:44306/测试

当我单击打开模式按钮时,它按预期工作。


当我使用以下值调用页面时:

https://localhost:44306/Test/TestValue

当我单击打开模式按钮时没有任何反应。


任何帮助表示赞赏!

0 投票
1 回答
525 浏览

c# - 在 Blazor 服务器端显示进行更改的位置

我有一个传感器列表,一旦新数据从传感器到达,我希望列表条目突出显示/闪烁一秒钟左右。使用该闪存,用户将被告知传感器数据已更改。

传感器数据在 内到达event,UI 刷新将由 触发StateHasChanged

一些想法:我有想法创建一个具有传感器数据和HasChanged属性的新类,但由于我想使用MatBlazorTables哪些用途foreach,我无法HasChanged在渲染后再次将其更改为 false。我的第二个想法是创建两个列表,一个包含“旧”数据,一个包含新到达的数据,然后 razor-component 查找进行更改的位置。

是否有更简单、更清洁的解决方案,可能已经嵌入到我尚未发现的 Blazor 中?

0 投票
1 回答
355 浏览

visual-studio - 在 VS 中使用双屏开发 Blazor Razor 组件

有没有办法在具有双屏环境的 Visual Studio 中打开 Razor 组件。我很想在一个屏幕上有标记,在另一个屏幕上有@code {}部分。虽然 MVC 开发通常标记在一个屏幕上,而 JS 在另一个屏幕上。切换到 Blazor C# 替换了 JS,但我的思想仍然映射到从一个读取标记,而另一个是代码。我们可以使用与 markp 分离但仍连接的代码创建组件吗? 在此处输入图像描述

0 投票
0 回答
1191 浏览

asp.net-core - Razor 组件和标签助手,为什么?如何?

阅读 ASP.Net Core 3.1 的最新文档,现在建议使用 Razor 组件而不是 View 组件。从 1,000 英尺看,这看起来是个好主意,因为现在有一个文件而不是“控制器”和默认的“视图”。更精确,更紧凑,我假设更有效。

让我感到惊讶的一大信息是 Razor 组件不支持标签助手(参考):

Razor 组件(.razor 文件)不支持标签助手。若要在 Blazor 中提供类似于 Tag Helper 的功能,请创建一个与 Tag Helper 具有相同功能的组件并改用该组件。

我是 .NET 世界中唯一一个认为这绝对不能接受的人吗?在视图组件中,标签助手是受支持的,并且是 .NET MVC 中最有用的部分。一个简单的例子是锚标签助手。在我看来,这是最有用的助手,因为它接受areacontrolleraction和一个动态参数列表,可以生成一个锚标记,而您不必担心找出路由。

足够令人发指,将其变成一个问题,现在如何在 Razor 组件中执行此操作?Microsoft 的标签助手文档中的示例是使用视图组件中的标签助手创建导航菜单的能力。现在,在视图组件页面上,建议使用 Razor 组件而不是视图组件(参考):

在考虑视图组件是否符合应用程序的规范时,请考虑改用 Razor 组件。Razor 组件还将标记与 C# 代码相结合,以生成可重用的 UI 单元。在提供客户端 UI 逻辑和组合时,Razor 组件旨在提高开发人员的工作效率。

因此,如果要使用 Razor 组件在 ASP.NET Core 3.1 (MVC) 中创建导航菜单,那么无需在 Startup 中记录每条路线的最简单方法是什么?

0 投票
1 回答
7621 浏览

c# - Blazor:未设置基类的 Razor 组件继承参数

我的一个剃须刀组件库有问题。

我的组件有一个抽象基类RazorHtmlComponent,它有一个参数属性[Parameter] public string InlineClass { get; set; },用于将 css 类映射到实际组件。然后,每个组件都有另一个基类,其中包含组件特定的属性,其定义如下:abstract class BaseRazorButton: RazorHtmlComponent

我的组件,在这个例子中RazorButton.razor继承自抽象按钮基类BaseRazorButton

问题是,当我实例化一个剃须刀按钮并将属性设置InlineClass为任何值时,它在我的实际RazorButton实例中保持为空。

这是一个最小的代码示例,以便更好地理解:

基类:

Dom 定义映射器:

按钮基类:

剃刀按钮组件:

Razor 按钮的实例化:

当我在浏览器中检查时,InlineClass未设置使用参数定义的类“页面”。在调试模式下, ClassMapper DefinitionRepository不包含类。

我错过了什么吗?我只是不明白为什么它不起作用:/