ASP.NET MVC Partial ViewとChild Action

この記事ではASPについて議論します.NET MVCフレームワークのPartial ViewとChild Action.

Partial View(サブビュー)

ASPを使用する.NET MVCフレームワークの開発では、同じHTMLコードをこの場所からその場所にコピーすることが多く、このコードが多くの場所で重複し、Layoutに入れられないことが多い.このようなコードを維持するのは難しいので、この重複したコードを修正する必要がある場合は、すべての重複した場所を修正する必要があります.一つ漏れても問題が発生しやすいです.
Partial Viewでは、コード再利用の問題とローカルリフレッシュの問題の2つの問題を解決できます.

Partial Viewの作成

VSのソリューションエクスプローラで、Viewsフォルダのサブフォルダを右クリックし、「追加」=>「ビュー」を選択し、「部分ビューとして作成」をチェックして名前ポイントを入力して確定すればよい.以下は簡単なPartial Viewのコード(ファイル名は「~/Views/Home/MyPartial.cshtml」)

<p>
    this is a partial view 
p>
<p>
        ：@DateTime.Now
p>

Partial ViewとViewの対比

現在、私の知っている限りでは、Partial ViewファイルとViewの唯一の違いは、Viewを表示するときに~/View/ViewStart.cshtmlファイルの内容は追加されますが、Partial Viewが表示されている場合は追加されません.デフォルトでは~/Views/ViewStart.cshtmlファイルには1行のコードLayout = "~/Views/Shared/_Layout.cshtml";しか含まれていません.この行のコードはコンパイル時にすべてのViewの一番上に追加されます.そのため、ViewファイルでLayout属性に値を割り当てる必要はありません.デフォルト値がありますが、Partial ViewのLayout属性にはデフォルト値はありません.Partial ViewのLayoutプロパティにはデフォルト値(またはデフォルト値null)がありませんが、必要に応じてPartial ViewにLayoutを指定することもできます.
その違いを除いて、ViewとPartial Viewは同じです.PartialViewではHTMLコードを作成したり、Razorエンジンを使ってC#コードを埋め込むなど、Partial Viewを強いタイプに指定したりして、Actionから渡されたデータを受け入れることができます(このActionはChild Actionでなければなりません.return PartialView();ではなくreturn View();が必要です.後で紹介します).

Partial Viewの使用

次の方法でページにPartial Viewを埋め込むことができます.

@Html.Partial("MyPartial")

この方法では、MyPartialファイルに定義したコードを現在のページに挿入します.

Child Action

Child Actionはreturn PartialView();を返すActionであり、その役割はPartialViewメソッドを返すことによってPartial Viewを提示することである.

public ActionResult MyPartial()
{
    ViewBag.Message = "hello,world";
    return PartialView();
}

このコードはMyPartialというPartial Viewを呼び出してブラウザに戻ります.ControllerとActionの基礎知識については、ASP.を参照してください.NET MVCコントローラとアクション.@Html.Partial("MyPartial")でPartial Viewを呼び出すと、ControllerやActionを経ずに対応するcshtmlファイルが直接見つかります.Partial Viewに対応するChild Actionを追加すると、ルーティングシステムによって必要なPartial Viewを返すことができ、例えば@Html.Action("MyPartial")で呼び出すことができ、リロードによってより多くのパラメータを渡し、Child Actionでパラメータを取得することができる.JQueryを使用してローカルリフレッシュを実現することもできます.コードは次のとおりです.

<script>
    $(function () {
        $('#button1').click(function () {
            $('#section1').load('@Url.Action("MyPartial")');
        });
    });
script>