Cosa è @RenderSection in asp.net MVC


170

Qual è lo scopo di @RenderSection e come funziona? Capisco cosa fanno i bundle, ma devo ancora capire cosa fa ed è probabilmente importante.

@RenderSection("scripts", required: false)

Forse un piccolo esempio su come usarlo?

Risposte:


287

Se hai una vista _Layout.cshtml come questa

<html>
    <body>
        @RenderBody()
        @RenderSection("scripts", required: false)
    </body>
</html>

allora puoi avere una visualizzazione del contenuto index.cshtml come questa

@section scripts {
     <script type="text/javascript">alert('hello');</script>
}

la richiesta indica se la visualizzazione utilizzando il layout di pagina deve avere una sezione di script


20

Se

(1) hai una vista _Layout.cshtml come questa

<html>
    <body>
        @RenderBody()

    </body>
    <script type="text/javascript" src="~/lib/layout.js"></script>
    @RenderSection("scripts", required: false)
</html>

(2) hai Contacts.cshtml

@section Scripts{
    <script type="text/javascript" src="~/lib/contacts.js"></script>

}
<div class="row">
    <div class="col-md-6 col-md-offset-3">
        <h2>    Contacts</h2>
    </div>
</div>

(3) hai About.cshtml

<div class="row">
    <div class="col-md-6 col-md-offset-3">
        <h2>    Contacts</h2>
    </div>
</div>

Nella pagina di layout, se richiesto è impostato su falso "@RenderSection (" script ", richiesto: falso)", quando il rendering della pagina e l'utente si trova sulla pagina, non viene eseguito il rendering dei contatti.js.

    <html>
        <body><div>About<div>             
        </body>
        <script type="text/javascript" src="~/lib/layout.js"></script>
    </html>

se richiesto è impostato su vero "@RenderSection (" script ", richiesto: vero)", Quando viene eseguito il rendering della pagina e l'utente si trova sulla pagina INFORMAZIONI, viene eseguito il rendering di STILL di contatti.js.

<html>
    <body><div>About<div>             
    </body>
    <script type="text/javascript" src="~/lib/layout.js"></script>
    <script type="text/javascript" src="~/lib/contacts.js"></script>
</html>

IN BREVE, quando impostato su true , che sia necessario o meno su altre pagine, verrà comunque visualizzato. Se impostato su false , verrà visualizzato solo quando viene visualizzata la pagina figlio.


16
questo non è corretto. Dovresti provare tu stesso la risposta e noterai che otterrai un Section not defined: "scripts".rendering quando visualizzi la tua pagina Informazioni quando imposti il ​​flag richiesto true.
cgijbels,

Solo un chiarimento. Non dovrebbero essere "script" anziché "Script"?
SRIDHARAN,

2

Ecco la definizione di Rendersection da MSDN

Nelle pagine di layout, esegue il rendering del contenuto di una sezione con nome. MSDN

Nella pagina _layout.cs inserire

@RenderSection("Bottom",false)

Qui rende il contenuto della sezione bootom e specifica la falseproprietà booleana per specificare se la sezione è richiesta o meno.

@section Bottom{
       This message form bottom.
}

Questo significato se si desidera passare alla sezione inferiore di tutte le pagine, è necessario utilizzare false come secondo parametro nel metodo Rendersection.


2

Supponiamo che io abbia GetAllEmployees.cshtml

<h2>GetAllEmployees</h2>

<p>
    <a asp-action="Create">Create New</a>
</p>
<table class="table">
    <thead>
         // do something ...
    </thead>
    <tbody>
       // do something ...
    </tbody>
</table>

   //Added my custom scripts in the scripts sections

@section Scripts
    {
    <script src="~/js/customScripts.js"></script>
    }

E un'altra vista "GetEmployeeDetails.cshtml" senza script

<h2>GetEmployeeByDetails</h2>

@Model.PageTitle
<p>
    <a asp-action="Create">Create New</a>
</p>
<table class="table">
    <thead>
       // do something ... 
    </thead>
    <tbody>
       // do something ...
    </tbody>
</table>

E la mia pagina di layout "_layout.cshtml"

@RenderSection("Scripts", required: true)

Quindi, quando navigo su GetEmployeeDetails.cshtml. Ottengo l'errore che non ci sono script di sezione da rendere in GetEmployeeDetails.cshtml. Se cambio la bandiera @RenderSection()da required : truein `` richiesto: falso`. Significa rendere gli script definiti negli script @section delle viste se presenti. Inoltre, non fare nulla. E l'approccio raffinato sarebbe in _layout.cshtml

@if (IsSectionDefined("Scripts"))
    {
        @RenderSection("Scripts", required: true)
    }
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.