انتقل إلى المحتوى

الأساسيات

نشر ملفات التصميم

نشر ملفات التصميم وتخصيص التنسيق

    php artisan vendor:publish --tag=dataview-view

إنشاء مكون جديد

  • قم بإنشاء مكون جديد باستخدام هذا الأمر الذي سينشئ فئة Component جديدة داخل مجلد Livewire.
  • يمكنك استبدال Dataview بأي مسار تحتاجه، كما تفعل عند إنشاء مكون عادي في Livewire.
  • PostData هو اسم هذا المكون.
php artisan dataview:make Dataview/PostsData
# أو إنشاء مكون item-view تلقائيًا باستخدام هذا الأمر
# هذا الأمر سينشئ مكون PostsData ومكون Item
php artisan dataview:make Dataview/PostsData --with-item=Dataview/PostItem

تهيئة فئة المكون

  • يجب عليك تمرير مكون عرض العنصر. مكوننا هو مجرد حاوية تحتاج إلى مكون item-view.
  • سيتم تمرير العناصر تلقائيًا إلى مكون item-view.
  • يجب أن يكون item-view مكون Livewire. إذا لم يتم العثور عليه، فسيتم إطلاق استثناء InvalidItemViewException.
namespace App\Livewire\Dataview;

use App\Models\Post;
use Aristonis\LaravelLivewireDataview\DataViewComponent;

class PostsData extends DataViewComponent
{
    protected function configure(): void
    {
        $this->setItemView('posts.post-card');

    }

    protected function query()
    {
        return Post::query()->with('comments');
    }
}
  • الآن بالنسبة لفئة عرض العنصر، يجب عليك تعريف خاصية item عامة أو استخدام طريقة mount.
namespace App\Livewire\posts;

use Livewire\Component;

class PostCard extends Component
{
    // Option 1
    public $item;

    // Option 2
    public function mount($item)
    {
        $this->item = $item;
    }

    public function render()
    {
        return view('livewire.posts.post-card');
    }
}
  • استدعاء المكون في صفحة Blade الخاصة بك
<livewire:dataview.posts-data>