Issue with Custom Carousel



  • Good day, I am trying to create a custom slider using Vue Carousel which has already been implemented and registered global in velocity app.js file. I am able to call the global component following the carousel documentation website.

    The issue is that the slider does not show up on the front-end unless I click on the page. I think this is Bagisto related.

    How do I fix this? Thanks.

    @push('scripts')
        <script type="text/x-template" id="top-stores-template">
            <div class="mb-4">
                <carousel>
                    <slide>
                      Slide 1 Content
                    </slide>
                    <slide>
                      Slide 2 Content
                    </slide>
                  </carousel>
            </div>
        </script>
    
        <script type='text/javascript'>
            (() => {
                Vue.component('top-stores', {
                    template: '#top-stores-template',
                    props: ['direction'],
                })
            })()
        </script>
    @endpush
    

    https://ssense.github.io/vue-carousel/guide/



  • Hi there,
    Is it possible to share your instance ?


Log in to reply