6

我正在使用 ASP.NET MVC 4。我有一个稍重的“导航菜单”和“标题”，这对所有页面都很常见。

我已经在布局中创建了所有菜单和标题内容，但是在每个导航中，浏览器都会重新加载菜单。有什么方法可以防止重新加载布局页面？

我正在使用 _ViewStart.cshtml 将视图与布局绑定。

4

3 回答 3

10

假设这将是您呈现的菜单 HTML

   <ul class="menu">
      <li><a href="/about/index">About</a></li>
      <li><a href="/contact/index">Contact</a></li>
   </ul>
   <div id="page-content">
   </div>

您的视图页面将创建为以下结构中的部分视图

About/index.cshtml
Contact/index.cshtml

注意： MVC 部分视图不会有<html> or <head> or <body>，它只会有内容，类似于 ASP.Net 中的用户控件。你cannot use @section in partial views

现在您所需要的就是使用 ajax 加载此部分内容并将其放置在使用 javascript 的页面内容的主要占位符 div 中

$(document).ready(function(){
$("ul.menu a").click(function(e){
  e.preventDefault(); // prevent default link button redirect behaviour     
  var url=$(this).attr("href");
  $('#page-content').load(url);
 });
});

希望对你有帮助！

于 2013-08-22T07:28:55.150 回答
1

如果导航菜单和标题对所有页面都是通用的，您应该尝试缓存它们。

如果您的结果视图由

  1. 标题
  2. 导航
  3. 菜单内容

你可以使用布局

@Html.RenderAction("header")
@Html.RenderAction("navigation")
@Render.Body()

其中“标题”和“导航”操作被大量缓存。

@Haacked 在这里提到了这篇很棒的博客文章http://haacked.com/archive/2009/05/11/donut-hole-caching.aspx

这种方法清楚地将您对标题和导航的关注分开。并且您可以专注于当前调用的 Action 所要显示的实际内容。

希望这可以帮助

注意：这个答案超级简化，如果您的导航基于访问页面的用户的角色/权限，则在执行缓存时您必须考虑动态参数和其他内容。

于 2013-08-22T06:40:42.310 回答
1

最好的方法是从控制器返回部分视图：

return PartialView();

您还可以通过添加到顶部来覆盖正在加载的局部视图布局中的 _layout：

@{
    Layout = null;
}
于 2021-05-23T17:44:21.213 回答