导航菜单

菜单可用于在应用程序中的不同页面之间导航。它可以为您生成所需的链接UrlField当数据绑定．

使用菜单在页面之间导航:

• 将菜单添加到应用程序中。
  • 您可以将其添加到MainLayout.razor在外面@Body，例如，在你的应用程序的头部分。
• 提供一组模型来描述您希望用户导航到的页面。
• 填充它UrlField用相应的数据从模型或提供Url属性。

这是一个菜单作为导航的基本例子。*@  @code {public List MenuData {get;设置;} protected override void OnInitialized() {GenerateMenuData();} public void GenerateMenuData() {MenuData = new List() {new MenuModel() {Text = "Contact us"， Url = "/contacts"， Icon = FontIcon。信封}，新的MenuModel(){文本=“设置”，Url =“/设置”，图标= FontIcon。齿轮，项目=新列表(){新MenuModel(){文本=“配置文件设置”，Url =“/ Profile”，图标= FontIcon。用户}，新的MenuModel(){文本= "语言设置"，Url = "/ Language "，图标= FontIcon。全球}}}};}公共类MenuModel{公共字符串文本{获取;设置;}公共字符串Url{获取;设置; } public FontIcon? Icon { get; set; } public List Items { get; set; } } }

笔记

• 的UrlField有一个默认值(Url)，即使你没有明确地定义它，如果出现在模型中，它也会被使用。

• 组件使用NavigationManager中的值执行导航UrlField．

  • 如果您有一个添加锚的模板，或者使用一个单击事件来导航用户自己，这可能会导致双重导航和错误，特别是如果您的模型有一个名为Url．为了避免此类问题，要么让Telerik组件进行导航，并删除同样进行导航的特定于应用程序的代码，要么删除URL设置(重命名模型字段，或者将UrlField到一个不存在的字段)。

另请参阅

• 菜单的概述
• 菜单数据绑定
• 菜单模板