javascript - How to load a vuejs build into another vuejs? - Stack Overflow

admin管理员组

文章数量:1290991

I made a SPA with laravel + vuejs3 (inertia).

My SPA works without worries, but I made a module that is on several sites (WP) which is a js file that loads on a tag with the id="form".

It works well on the several sites but here since I use a SPA I have the impression that it does not work.

As soon as I navigate elsewhere with a <Link> from inertia (so in SPA without refreshing the browser) and I come back to the form it does not work. So it only works the first time, do you have any idea what to do? Because currently I am going through a complete PHP page but I do not like it if I would like to find a solution!

so in my controller I simply have:

return Inertia::render('Form');

and at this point in my view I simply do:

<div id="form"></div>

and in my app.blade.php

<script type="module" crossorigin src="{{ asset('/js/index-8AJeVKiN.js') }}"></script>

when I do that the module does not load, so I did this in the .vue file:

        mounted(){
            this.loadScript('/js/index-8AJeVKiN.js', () => {
            });
        },
        watch:{
        },
        methods:{
            loadScript(src, callback) {
                if (!document.querySelector(`script[src="${src}"]`)) {
                    const script = document.createElement('script');
                    script.src = src;
                    script.type = 'module'; // Ajoute type="module" si nécessaire
                    script.onload = callback; // Appeler la fonction callback une fois chargé
                    document.head.appendChild(script);
                } else {
                    callback(); // Appeler la fonction directement si déjà chargé
                }
            },
        },

本文标签： javascriptHow to load a vuejs build into another vuejsStack Overflow