Dinamically control content of <x-filament::modal>
Hey everyone, I have a custom page that loads A LOT of models and for each of these models there's a
<x-filament::modal
with details about that specific model.
Since it's a high number of models, this page is becoming incredibly slow, I was given the task to optmize it. I thought about the idea of having only one modal on the page and dinamically change the contents inside it before opening after I click one of the models Open modal
button.
The problem is: I couldn't find a documentation page talking about doing this. My knowledge about livewire, while not zero, isn't great. Can someone point to a docs page of an article where this is done (if one exists) so I can get a better grasp about this idea?
Thanks3 Replies
I don't think there will be an article for that. This is not really Livewire related but more a Javascript question.
How are you using those modals? If you are using Actions I don't think you can replace them.
@Dennis Koch The original developer who created this page used Livewire Actions so that's how it is now.
I think the main problem here is that everything is just one big Livewire component.
I'm trying to think of a possibility using multiple nested components which only load their respective modals when clicked
It's hard to tell without seeing any code. But usually breaking large components down into smaller ones is always a good idea.