MVC左侧菜单栏

以下是使用MVC框架实现一个简单的左侧菜单栏的代码示例：

在控制器中创建一个方法，将菜单数据传递给视图：

public IActionResult Index()
{
    var menuItems = new List<string> { "菜单项 1", "菜单项 2", "菜单项 3", "菜单项 4" };
    
    ViewBag.MenuItems = menuItems;
    
    return View();
}

在视图中，使用以下代码来显示菜单：

<div class="sidebar">
    <ul>
        @foreach (var item in ViewBag.MenuItems)
        {
            <li><a href="#">@item</a></li>
        }
    </ul>
</div>

这将生成一个简单的左侧菜单栏，其中包含菜单项。您可以根据需要进行样式和内容的修改。如果您需要添加更复杂的菜单项，例如包含子菜单的菜单项，请参考我之前回答的左侧二级菜单栏的示例。

相关问题

MVC左侧二级菜单栏

如果您正在使用MVC框架，可以使用以下代码来实现左侧二级菜单栏：

首先，创建一个模型类，用于存储菜单项的数据：

public class MenuItem
{
    public string Name { get; set; }
    public string Url { get; set; }
    public List<MenuItem> SubItems { get; set; }
}

然后，在控制器中创建一个方法来生成菜单数据，并将其传递给视图：

public IActionResult Index()
{
    var menuItems = new List<MenuItem>
    {
        new MenuItem
        {
            Name = "菜单项 1",
            Url = "#",
            SubItems = new List<MenuItem>
            {
                new MenuItem { Name = "子菜单项 1", Url = "#" },
                new MenuItem { Name = "子菜单项 2", Url = "#" },
                new MenuItem { Name = "子菜单项 3", Url = "#" }
            }
        },
        new MenuItem
        {
            Name = "菜单项 2",
            Url = "#",
            SubItems = new List<MenuItem>
            {
                new MenuItem { Name = "子菜单项 4", Url = "#" },
                new MenuItem { Name = "子菜单项 5", Url = "#" },
                new MenuItem { Name = "子菜单项 6", Url = "#" }
            }
        }
    };
    
    ViewBag.MenuItems = menuItems;
    
    return View();
}

在视图中，使用以下代码来显示菜单：

<div class="sidebar">
    <ul>
        @foreach (var item in ViewBag.MenuItems)
        {
            <li>
                <a href="@item.Url">@item.Name</a>
                @if (item.SubItems != null && item.SubItems.Any())
                {
                    <ul>
                        @foreach (var subItem in item.SubItems)
                        {
                            <li><a href="@subItem.Url">@subItem.Name</a></li>
                        }
                    </ul>
                }
            </li>
        }
    </ul>
</div>

这将生成一个左侧菜单栏，其中包含二级菜单项。您可以根据需要进行样式和内容的修改。

MVC左侧二级菜单栏模板

以下是一个简单的 MVC 左侧二级菜单栏模板：

<div class="sidebar">
  <ul>
    <li>
      <a href="#">菜单1</a>
      <ul>
        <li><a href="#">子菜单1</a></li>
        <li><a href="#">子菜单2</a></li>
        <li><a href="#">子菜单3</a></li>
      </ul>
    </li>
    <li>
      <a href="#">菜单2</a>
      <ul>
        <li><a href="#">子菜单1</a></li>
        <li><a href="#">子菜单2</a></li>
        <li><a href="#">子菜单3</a></li>
      </ul>
    </li>
    <li>
      <a href="#">菜单3</a>
      <ul>
        <li><a href="#">子菜单1</a></li>
        <li><a href="#">子菜单2</a></li>
        <li><a href="#">子菜单3</a></li>
      </ul>
    </li>
  </ul>
</div>

其中，`.sidebar` 是侧边栏的外层容器，`ul` 和 `li` 是菜单和子菜单的列表项。菜单和子菜单之间使用嵌套的 `ul` 和 `li` 实现。您可以根据自己的需求修改菜单项和子菜单项的文本和链接。