Layout与View模型类型不匹配报错，如何让RenderBody仅渲染目标视图？

你遇到的问题核心是：布局页依赖PeriodIndexModel渲染侧边栏，但点击菜单后控制器返回的视图使用ExpenseListModel，导致整个页面的模型类型不匹配。以下是几种直接可行的解决方法：

方法1：用ViewBag/ViewData传递侧边栏数据 #

让布局页不再依赖页面主模型，而是通过ViewBag单独获取侧边栏需要的PeriodIndexModel数据：

1. 修改布局页侧边栏代码：
   把原来依赖@Model的部分改成从ViewBag读取，比如：

   @* 原来的侧边栏循环 *@
   @foreach (var period in ViewBag.PeriodData.Periods)
   {
       <a class="link-body-emphasis d-inline-flex text-decoration-none rounded"
          asp-area="" asp-controller="Expense" asp-action="GetExpenses">
           @period.PeriodText
       </a>
   }
   

2. 在所有使用该布局的控制器Action中设置ViewBag：
   包括GetExpenses在内，每个Action都要把侧边栏需要的周期数据放入ViewBag：

   public IActionResult GetExpenses()
   {
       // 获取费用列表数据
       var expenseList = _expenseService.GetExpenses();
       // 获取侧边栏周期数据
       var periodModel = _periodService.GetPeriodIndexModel();
       // 存入ViewBag
       ViewBag.PeriodData = periodModel;
       // 返回费用视图，模型为ExpenseListModel集合
       return View(expenseList);
   }
   

方法2：创建布局基类ViewModel #

定义一个包含侧边栏数据的基类ViewModel，让页面的ViewModel继承它，实现模型统一：

1. 创建基类ViewModel：

   public class LayoutBaseViewModel
   {
       public PeriodIndexModel SidebarPeriods { get; set; }
   }
   

2. 定义页面专用ViewModel：
   比如费用页面的ViewModel继承基类：

   public class ExpensePageViewModel : LayoutBaseViewModel
   {
       public List<ExpenseListModel> Expenses { get; set; }
   }
   

3. 修改控制器Action：
   组合基类数据和页面数据后返回：

   public IActionResult GetExpenses()
   {
       var viewModel = new ExpensePageViewModel
       {
           SidebarPeriods = _periodService.GetPeriodIndexModel(),
           Expenses = _expenseService.GetExpenses()
       };
       return View(viewModel);
   }
   

4. 修改布局页和视图的模型声明：
   布局页模型改为基类：

   @model LayoutBaseViewModel
   

   费用视图模型改为专用ViewModel：

   @model ExpensePageViewModel
   

   这样布局页用@Model.SidebarPeriods渲染侧边栏，视图用@Model.Expenses渲染内容，互不冲突。

方法3：将侧边栏封装为局部视图（推荐） #

把侧边栏做成独立的局部视图，单独给它传递PeriodIndexModel，彻底和页面主模型解耦：

1. 创建侧边栏局部视图（_Sidebar.cshtml）：

   @model PeriodIndexModel
   @* 侧边栏菜单代码 *@
   @foreach (var period in Model.Periods)
   {
       <a class="link-body-emphasis d-inline-flex text-decoration-none rounded"
          asp-area="" asp-controller="Expense" asp-action="GetExpenses">
           @period.PeriodText
       </a>
   }
   

2. 在布局页中调用局部视图：
   直接在布局页侧边栏位置渲染局部视图，并且单独传入模型数据（可以通过依赖注入直接获取服务数据，不用每个Action处理）：

   @inject IPeriodService PeriodService
   @await Html.PartialAsync("_Sidebar", PeriodService.GetPeriodIndexModel())
   

   这种方式下，布局页不需要声明任何模型，RenderBody的视图可以自由使用ExpenseListModel，完全解耦。

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