You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

求助:在MVC Core应用中创建母版页的方法(新手)

在ASP.NET MVC Core中实现类似母版页的功能(布局页详解)

嘿,我刚接触MVC Core的时候也纠结过这个!在ASP.NET MVC Core里,原来Dot Net Framework的母版页对应的是布局页(Layout),思路和母版页一致,但实现细节有一点点不同,我给你捋捋最实用的步骤:

1. 先看项目自带的默认布局页

如果你是用官方模板创建的MVC Core项目,其实已经帮你做好基础布局了!它在Views/Shared/_Layout.cshtml路径下,这个文件就相当于你之前用的母版页,里面包含了网站通用的头部导航、页脚、全局样式/脚本这些重复内容。

2. 手动创建自定义布局页

如果需要全新的布局,或者项目里没有默认布局,手动创建很简单:

  • 右键Views/Shared文件夹 → 添加 → 新建项 → 选择「Razor布局」(也可以直接新建.cshtml文件,命名比如_AdminLayout.cshtml
  • 在布局页中,用@RenderBody()标记来指定子页面内容的插入位置——这就对应你之前母版页里的ContentPlaceHolder
  • 要是需要可选的内容区块(比如侧边栏、页面专属脚本区),可以用@RenderSection()定义,示例:
    <!-- 布局页里的脚本区 -->
    @RenderSection("PageScripts", required: false)
    
    这样子页面就可以选择性地填充这个区块的内容。

3. 给视图绑定布局页

  • 全局默认布局:打开Views/_ViewStart.cshtml,里面的Layout = "_Layout";就是设置所有视图默认使用的布局,你可以改成自己的布局名称,比如Layout = "_AdminLayout";
  • 单个视图单独指定:如果某个视图要使用不同的布局,直接在视图顶部加上:
    @{
        Layout = "_AdminLayout";
    }
    
  • 禁用布局:如果某个视图不需要布局,设置Layout = null;即可。

4. 给布局页传递数据

如果需要把数据(比如用户信息、页面标题)传到布局页,常用的方式有:

  • ViewBag/ViewData:简单快捷,适合传递少量数据。比如在控制器里:
    public IActionResult Home()
    {
        ViewBag.SiteTitle = "我的MVC Core网站";
        return View();
    }
    
    然后在布局页里直接调用:
    <h1>@ViewBag.SiteTitle</h1>
    
  • ViewComponent:更灵活,适合复杂的可复用组件(比如用户头像导航),这个可以等你熟悉基础后再深入研究。

是不是感觉和母版页的逻辑很像?多试两次就能上手啦!

内容的提问来源于stack exchange,提问作者user1238784

火山引擎 最新活动