بخش سوم - کامپوننت ها - قسمت اول
کامپوننتها، ابزارهایی قدرتمند برای تسهیل توسعه رابط کاربری (UI) در برنامههای وب هستند. کامپوننتها به شما این امکان را میدهند که بخشهای کوچکی از رابط کاربری را به صورت مجزا ایجاد و مدیریت کنید، که این باعث میشود کدهای شما تمیزتر و قابل نگهداریتر باشند.
کامپوننتها قطعات قابل استفاده مجدد از کد هستند که شامل HTML و منطق لازم برای ایجاد بخشی از رابط کاربری میشوند. این کامپوننتها میتوانند دادهها را از والدین خود دریافت کنند و میتوانند به راحتی در بخشهای مختلف پروژه استفاده شوند.
کامپوننتها در لاراول معمولاً از دو بخش تشکیل میشوند:
1- بخش HTML: که ساختار رابط کاربری را تعریف میکند.
2- بخش منطقی (Logic): که میتواند شامل متدها و دادههایی باشد که برای تولید HTML مورد نیاز است. این بخش به طور معمول در کلاسهای PHP تعریف میشود.
کامپوننتها میتوانند به سادگی در فایلهای Blade فراخوانی شوند. برای مثال، اگر یک کامپوننت به نام alert دارید، میتوانید آن را به این صورت فراخوانی کنید:
<x-alert type="danger" :message="This is a danger alert" />
این فراخوانی، کامپوننت مربوطه را به همراه دادههایی که به آن ارسال شده است، در صفحه نمایش میدهد.
لاراول دو نوع کامپوننت ارائه میدهد:
کامپوننتهای کلاس محور (Class-based Components) و کامپوننتهای بدون کلاس (Anonymous Components).
کامپوننتهای کلاس محور شامل یک فایل PHP کلاس برای مدیریت منطق هستند، در حالی که کامپوننتهای بدون کلاس تنها به یک فایل Blade برای نمایش متکی هستند و منطق پیچیدهای ندارند.
برای ساخت کامپوننت های کلاس محور میتوان از دستور زیر استفاده کرد:
php artisan make:component Alert
این دستور یک کامپوننت با نام Alert ایجاد می کند که شامل یک کلاس در
app/View/Components و یک فایل View در resources/views/components می باشد.برای ساخت کامپوننت های بدون کلاس یا ناشناس می توانید از دستور زیر استفاده کنید:
php artisan make:component input --view
این دستور تنها یک فایل View در
resources/views/components ایجاد می کند.همچنین می توانید کامپوننت ها را در فولدر های تو در تو ایجاد کنید:
# Class-based Components
php artisan make:component Forms/Input
# app/View/Components/Forms/Input.php
# resources/views/components/forms/input.blade.php
# Anonymous Components
php artisan make:component forms.input --view
# resources/views/components/forms/input.blade.php
همچنین برای فراخوانی کامپوننت از فولدر های خاص:
<x-forms.input />
حال که کامپوننت خود را ایجاد کرده اید، کافی است کد های HTML خود را درون فایل View کامپوننت بنویسید و با فراخوانی کاپوننت آنها را نمایش دهید:
// resources/views/components/alert.blade.php
<div class="alert alert-success">
This is an alert componnet!
</div>
و برای فراخوانی آن:
// Another View file in another world
<x-alert />
#laravel #فصل_۳
@AmirhDeveloper