wire-elements / pro-demo

8 stars 0 forks source link

Adding Livewire components that use scripts does not work #3

Open craigvc opened 1 year ago

craigvc commented 1 year ago

I made a slideover, and added a livewire component inside it (laravel comments with livewire Slideover Code <x-wire-elements-pro::bootstrap.slide-over :content-padding="false"> @livewire('tenant.modules.tasks.components.slide-over.task-detail-comments') </x-wire-elements-pro::bootstrap.slide-over>

Livewire Controller

`<?php

namespace App\Http\Livewire\Tenant\Modules\Tasks\Components\SlideOver;

use App\Models\Tenant\Task;
use Livewire\Component;

class TaskDetailComments extends Component
{
    public $task = 1;
    public function mount(Task $task)
    {
        $this->task = $task;
    }
    public function render()
    {
        return view('livewire.tenant.modules.tasks.components.slide-over.task-detail-comments');
    }
}`

Livewire blade

`<div>
    <x-comments::styles />
    @ray($task)
    Task Details {{ $task->id}}
    <livewire:comments :model="$task" />
    <x-comments::scripts />
</div>`

The issue comes with loading the when used in a slideover component

Any ideas @PhiloNL

PhiloNL commented 1 year ago

@craigvc can you try moving

<x-comments::styles />
<x-comments::scripts />

To your base layout file. These need to be part of the initial page load as they are not loaded when loading a modal / slideover.

craigvc commented 1 year ago

@PhiloNL I tried that too, I also actually got it working by adding an actual comments componentn to the page that calls the modal - but only the by displaying an actual comment - (just the script tags dont work on their own on the calling page) its not gonna be any good to me though as i dont need the comments on the calling page :) i just need it on the modal.