ASP.NET Core单控制器实现多页面独立URL及内容切换方法咨询

嘿，这个需求在ASP.NET Core里完全可以轻松实现，我分几个步骤给你捋清楚：

1. 定义通用视图模型 #

首先我们需要一个统一的视图模型，用来给不同页面传递差异化的内容和状态：

public class PageViewModel
{
    public string PageTitle { get; set; }
    public string PageContent { get; set; }
    // 标记当前激活的页面，方便导航按钮高亮
    public string ActivePage { get; set; }
}

2. 创建控制器及对应Action #

我们新建一个PageController，里面写三个Action分别对应三个页面，每个Action返回同一个视图，但传入不同的模型数据：

using Microsoft.AspNetCore.Mvc;

// 统一路由前缀，确保URL格式为 /page/xxx
[Route("page")]
public class PageController : Controller
{
    // 对应URL: http://mydomain/page/Home
    public IActionResult Home()
    {
        var model = new PageViewModel
        {
            PageTitle = "首页",
            PageContent = "这里是首页的专属内容，欢迎访问！",
            ActivePage = "Home"
        };
        return View("SharedPage", model); // 指定共用视图
    }

    // 对应URL: http://mydomain/page/Load
    public IActionResult Load()
    {
        var model = new PageViewModel
        {
            PageTitle = "加载页面",
            PageContent = "这是加载状态展示页面，包含资源加载进度等内容",
            ActivePage = "Load"
        };
        return View("SharedPage", model);
    }

    // 对应URL: http://mydomain/page/Blog
    public IActionResult Blog()
    {
        var model = new PageViewModel
        {
            PageTitle = "博客页面",
            PageContent = "这里是最新的技术博客文章列表，欢迎阅读！",
            ActivePage = "Blog"
        };
        return View("SharedPage", model);
    }
}

3. 创建共用视图 #

在Views/Page目录下创建SharedPage.cshtml（如果想全局复用，也可以放在Views/Shared目录），视图里根据模型渲染动态内容和导航：

@model PageViewModel

<!DOCTYPE html>
<html>
<head>
    <title>@Model.PageTitle</title>
    <style>
        /* 给当前激活的导航按钮加高亮样式 */
        .nav-btn.active { 
            color: #007bff; 
            font-weight: bold;
            border-bottom: 2px solid #007bff;
        }
        .nav-btn {
            margin-right: 15px;
            text-decoration: none;
            padding: 8px 0;
        }
    </style>
</head>
<body>
    <!-- 导航栏区域 -->
    <div style="padding: 10px 0; border-bottom: 1px solid #eee;">
        <a asp-controller="Page" asp-action="Home" class="nav-btn @(Model.ActivePage == "Home" ? "active" : "")">首页</a>
        <a asp-controller="Page" asp-action="Load" class="nav-btn @(Model.ActivePage == "Load" ? "active" : "")">加载页面</a>
        <a asp-controller="Page" asp-action="Blog" class="nav-btn @(Model.ActivePage == "Blog" ? "active" : "")">博客页面</a>
    </div>

    <!-- 动态内容区域 -->
    <div style="margin-top: 20px; padding: 0 10px;">
        <h1>@Model.PageTitle</h1>
        <p>@Model.PageContent</p>
    </div>
</body>
</html>

这里用到了ASP.NET Core的标签助手（asp-controller和asp-action），它会自动生成正确的URL，不用硬编码，后期路由规则变动也不用手动修改链接。

4. 确认路由配置（可选） #

如果你用的是默认路由模板，在Program.cs里确保模板包含控制器和Action参数：

app.MapControllerRoute(
    name: "default",
    pattern: "{controller=Home}/{action=Index}/{id?}");

配合我们给控制器加的[Route("page")]属性，就能完美映射到目标URL。

额外优化小技巧 #

• 把导航部分抽成局部视图（比如_Navigation.cshtml），这样其他页面也能复用导航逻辑，减少代码重复。
• 如果页面数据需要从数据库或外部服务获取，可以在Action里注入对应的服务，再填充到模型中。

这样一套流程走下来，你就实现了单个控制器对应三个独立URL、共用一个视图，并且导航能正确切换页面和加载对应模型数据的需求啦！

内容的提问来源于stack exchange，提问作者qunz666