<div class="control-section">
<div class="menu-control">
<SfMenu Items="@MenuItems">
<MenuEvents TValue="MenuItem" ItemSelected="@ItemSelected"></MenuEvents>
</SfMenu>
</div>
</div>
@code {
public List<MenuItem> MenuItems = new List<MenuItem>{
new MenuItem { Text = "Home", Url = "https://www.google.com/search?q=fashion"},
new MenuItem{
Text = "Store Categories",
Items = new List<MenuItem>{
new MenuItem { Text= "One", Id = "1" },
new MenuItem { Text= "Two", Id = "2" }}
}
};
private void ItemSelected(MenuEventArgs<MenuItem> e)
{
Console.WriteLine("itemSelected: " + e.Item.Id);
}
}
<style>
.e-menu-wrapper {
text-align: center;
}
.menu-control {
margin-top: 0px;
text-align: right;
}
</style>
Sources:
https://blazor.syncfusion.com/documentation/context-menu/how-to/open-dialog/
https://blazor.syncfusion.com/documentation/menu-bar/how-to/customize-menu-using-events/
Comments