How to dynamically add livewire components with ajax

What seems to be the problem:
I want to pass ‘livewire:icon-upload’ through ajax and display it in html. I successfully received livewire:icon-upload, but when writing the information into html via innerHTML, it cannot be displayed normally
Steps to Reproduce:

VU_0SCHP24GULL`M744NIKB
Are you using the latest version of Livewire:
livewire2.0
Do you have any screenshots or code examples:

Why you are using jQuery to handle the AJAX stuff and livewire made for that!

You can do all that just by livewire, no need to implement jQuery

To echo @skywalker, I’m unsure why you’re trying to go the ajax route when livewire implements all the dom-diffing in box. To me, the primary selling point of livewire is so that you don’t have to roll your own back-and-forth system to and from the server.

Also, components that start with <livewire: need to be instantiated in the backend. If it’s passing you back <livewire:icon-upload /> then chances are high that it hasn’t been rendered for the front-end.

If you’re intent on custom rolling your ajax solution, I feel like it’d be more lightweight to just do ajax + php/laravel and not worry about using livewire.

1 Like

Thank you for noticing my problem. I want to implement an upload function and found that the upload of livewire is perfect, so I completed this function with livewire. Because I have not fully understood the other excellent parts of livewire, I dare not use too many functions of livewire, and other parts use jQuery-based ajax for data transmission.

Thanks for your answer, I seem to understand why it went wrong

1 Like

You are very welcome mate.

Feel free to ask if you have any further questions in your mind or even issues