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?

asp.net-mvc Aflred
sumber

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

cgijbels
sumber
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.

Maria Jesusa Galapon
sumber
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.

Brijesh Mavani
sumber
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)
    }
Vijay
sumber