Blazor菜单概述

的Blazor菜单组件显示数据(持平或分层)在传统的菜单式结构。除了内置导航功能,您可以浏览商品和他们的孩子,定义模板各个节点的渲染文本和图标/图片,和应对事件。

菜单组件的一部分Telerik UI Blazor与100年,专业年级UI库本机组件来构建现代和功能丰富的应用程序。尝试注册一个免费试用。

下载免费试用

创建Blazor菜单

1. 使用TelerikMenu标签页面将组件添加到您的剃须刀。

2. 填充数据属性集合的项目你想要出现在菜单。菜单会自动识别属性名Id,ParentId,文本和其他几个人。否则,使用绑定配置自定义属性的名称。

@ *之间使用一个菜单导航视图* @ < TelerikMenu数据= " @MenuItems " / > @code{公共列表<子菜单>菜单项{得到;设置;}公共类公共字符串文本菜单项{{得到;设置;{}公共字符串Url获得;设置;}<子菜单>公共列表项{得到;设置;}}保护覆盖空白OnInitialized(){菜单项=新列表<子菜单>(){新菜单项(){文本= "公司",/ /物品,没有一个URL不会呈现链接项=新列表<子菜单>(){新菜单项(){文本=“概述”,URL =“公司/概述”},新的菜单项(){文本=“事件”,URL =“公司/事件”},新的菜单项(){文本=“事业”,URL =“公司/事业}}},新的菜单项(){文本=“服务”,项目=新列表<子菜单>(){新菜单项(){文本=“咨询”,URL = " consultingservices "},新的菜单项(){文本=“教育”,URL = "教育"}}}};万博体育手机版网址base.OnInitialized (); } }

数据绑定

表现出任何物品,Blazor菜单需要一个数据源,您可以提供的数据财产。菜单允许您显示项目既是平面数据和等级制度。阅读更多关于Blazor菜单数据绑定…

导航视图

菜单通常用于列表页,视图,或部分应用程序,这样用户可以浏览它们。,在一个菜单,你有两种选择:

• 使用内置的UrlField在绑定数据填充菜单的锚的URL将生成如果你为给定的项目提供一个URL。这种方法中显示创建Blazor菜单的例子。
• 使用一个模板生成所需的链接(例如,NavLink与您自己的代码组件),使微调。

阅读更多关于Blazor菜单导航……

取向

Blazor菜单允许你控制它的方向和横向或纵向显示项。阅读更多关于Blazor菜单定位……

模板

您可以使用内置的模板和定制的功能呈现什么物品。阅读更多关于Blazor菜单模板…

菜单图标

为了说明每个菜单项的目的,Blazor菜单允许您添加图片,图标类,或字体图标。阅读更多关于Blazor菜单图标…

事件

Blazor菜单生成事件,您可以进一步处理和自定义其行为。阅读更多关于Blazor菜单事件……

菜单参数

下表列出了上下文菜单参数,都与这个页面上的其他功能。检查菜单API参考完整列表的属性、方法和事件。

下一个步骤

• 绑定数据菜单

• 使用菜单页面之间导航

另请参阅

• 现场演示:菜单
• API参考