Mahmoud Alrashidi نشر 2 مارس 2021 أرسل تقرير نشر 2 مارس 2021 لدي مُكونين livewire: <div class="col-md-4 p-4"> @livewire('app-add-task') </div> <div class="col-md-8 p-4"> @livewire('app-tasks') </div> المُكون الأول لإضافة مهمة جديدة و المُكون الثاني لعرض جميع المهام، عند إضافتي للمهمة يتم إضافتها لكن لا تظهر مباشرة في الصفحة و إنما حتى أقوم بتحديث الصفحة هل هناك طريقة لعرض المهمة مباشرة من دون تحديث للصفحة، هذا كود المُكون الأول: class AppAddTask extends Component { public $title; public function render() { return view('livewire.app-add-task'); } public function addTask() { auth()->user()->tasks()->create([ 'title' => $this->title, 'status' => false, ]); $this->title = ""; } } و هذا كود المُكون الثاني: class AppTasks extends Component { public function render() { $totalTasks = auth()->user()->tasks()->count(); $tasks = auth()->user()->tasks()->latest()->get(); return view('livewire.app-tasks', [ 'totalTasks' => $totalTasks, 'tasks' => $tasks ]); } } 1 اقتباس
1 سمير عبود نشر 2 مارس 2021 أرسل تقرير نشر 2 مارس 2021 نعم فالفكرة تكمن في إستخدام الأحداث و هناك عدة طرق لإستخدامها من بينها إرسال أو عمل emit للحدث من خلال المُكون الأول و التسمع على الحدث في المُكون الثاني لكن بما أننا نريد عمل تحديث ف livewire توفر طريقة خاصة إسمها $refresh، يُمكن التعامل مع الأحداث بعدة طرق عن طريق القالب أو عن طريق كلاس المُكون أو عن طريق javascript و هذا شرح الطريقة الثانية: إرسال الحدث من المكون الأول: class AppAddTask extends Component { public $title; public function render() { return view('livewire.app-add-task'); } public function addTask() { auth()->user()->tasks()->create([ 'title' => $this->title, 'status' => false, ]); $this->title = ""; $this->emit('taskAdded'); // هنا قمنا بإرسال الحدث } } التسمع على الحدث من خلال المُكون الثاني و عمل refresh: class AppTasks extends Component { protected $listeners = ['taskAdded' => '$refresh']; // التسمع و عمل تحديث public function render() { $totalTasks = auth()->user()->tasks()->count(); $tasks = auth()->user()->tasks()->latest()->get(); return view('livewire.app-tasks', [ 'totalTasks' => $totalTasks, 'tasks' => $tasks ]); } } 1 اقتباس
السؤال
Mahmoud Alrashidi
لدي مُكونين livewire:
المُكون الأول لإضافة مهمة جديدة و المُكون الثاني لعرض جميع المهام، عند إضافتي للمهمة يتم إضافتها لكن لا تظهر مباشرة في الصفحة و إنما حتى أقوم بتحديث الصفحة هل هناك طريقة لعرض المهمة مباشرة من دون تحديث للصفحة،
هذا كود المُكون الأول:
و هذا كود المُكون الثاني:
1 جواب على هذا السؤال
Recommended Posts
انضم إلى النقاش
يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.