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

このアプローチにより、ヘッダーとナビゲーションに関する懸念が明確に分離されます。そして、現在呼び出されているアクションによって表示される実際のコンテンツに集中できます。

お役に立てれば

注：この回答は非常に単純化されており、ページにアクセスするユーザーの役割/権限に基づいてナビゲーションを行う場合、キャッシングを実行する際に動的パラメーターなどを考慮する必要があります。

于 2013-08-22T06:40:42.310 に答える