Apa itu @RenderSection di asp.net MVC


170

Apa tujuan dari @RenderSection dan bagaimana fungsinya? Saya mengerti apa yang bundel lakukan, tetapi saya belum mencari tahu apa artinya ini dan itu mungkin penting.

@RenderSection("scripts", required: false)

Mungkin contoh kecil tentang cara menggunakannya?

Jawaban:


287

Jika Anda memiliki tampilan _Layout.cshtml seperti ini

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

maka Anda dapat memiliki tampilan konten index.cshtml seperti ini

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

yang diperlukan menunjukkan apakah tampilan menggunakan halaman tata letak harus memiliki bagian skrip


20

Jika

(1) Anda memiliki tampilan _Layout.cshtml seperti ini

<html>
    <body>
        @RenderBody()

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

(2) Anda memiliki 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) Anda memiliki About.cshtml

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

Pada halaman tata letak Anda, jika diperlukan diatur ke false "@RenderSection (" skrip ", diperlukan: false)", Ketika halaman merender dan pengguna berada di sekitar halaman, contacts.js tidak merender.

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

jika diperlukan disetel ke true "@RenderSection (" skrip ", wajib: true)", Saat laman merender dan pengguna berada di laman TENTANG, contacts.js MASIH akan dirender.

<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>

DI SINGKAT, ketika disetel ke true , apakah Anda memerlukannya atau tidak di halaman lain, itu akan ditampilkan. Jika disetel ke false , itu hanya akan ditampilkan saat laman anak dirender.


16
ini tidak benar. Anda harus mencoba jawaban Anda sendiri dan Anda akan melihat bahwa Anda akan mendapatkan Section not defined: "scripts".ketika merender halaman Tentang Anda ketika mengatur bendera yang diperlukan true.
cgijbels

Hanya klarifikasi. Bukankah itu "skrip", bukan "Skrip"?
SRIDHARAN

2

Di sini pembelaan Rendersection dari MSDN

Di halaman tata letak, merender konten dari bagian bernama. MSDN

Di halaman _layout.cs cantumkan

@RenderSection("Bottom",false)

Di sini render konten dari bagian bootom dan tentukan falseproperti boolean untuk menentukan apakah bagian tersebut diperlukan atau tidak.

@section Bottom{
       This message form bottom.
}

Artinya jika Anda ingin bagian bawah di semua halaman, maka Anda harus menggunakan false sebagai parameter kedua di metode Rendersection.


2

Misalkan jika saya memiliki 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>
    }

Dan tampilan lain "GetEmployeeDetails.cshtml" tanpa skrip

<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>

Dan halaman tata letak saya "_layout.cshtml"

@RenderSection("Scripts", required: true)

Jadi, ketika saya menavigasi ke GetEmployeeDetails.cshtml. Saya mendapatkan kesalahan bahwa tidak ada skrip bagian yang akan ditampilkan di GetEmployeeDetails.cshtml. Jika saya mengubah flag in @RenderSection()dari required : truemenjadi `` required: false`. Itu berarti merender skrip yang didefinisikan dalam skrip @section dari view jika ada. Coba, jangan lakukan apa-apa. Dan pendekatan yang disempurnakan akan dalam _layout.cshtml

@if (IsSectionDefined("Scripts"))
    {
        @RenderSection("Scripts", required: true)
    }
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.