.A performance concentrated Vue slide carousel designed for SSR/SSG atmospheres. No JS is actually made use of to format the carousel or it is actually slides. The goal is actually to boost LCP and also CLS credit ratings because there is actually no style or even profit adjustments when JS hydates. It is actually largely made for rendering "card" style slides (like for connecting to posts or items) where the carousel-ness is conditionally applied based upon the variety of cards that are actually slotted in in addition to the viewport size.Browse through the trial: https://vue-ssr-carousel.netlify.app.Put in.anecdote incorporate vue-ssr-carousel.Default.bring in SsrCarousel coming from 'vue-ssr-carousel'.bring in ssrCarouselCss coming from 'vue-ssr-carousel/index. css'.Vue.component 'ssr-carousel', SsrCarousel.Nuxt.// nuxt.config.js.export default buildModules: [' vue-ssr-carousel/nuxt']Use.Slide 1.Slide 2.Slide 3.For more instances, see the demo: https://vue-ssr-carousel.netlify.app.Tips.If your slides are created with v-for, make use of key market values that are based upon the information you are actually looping via. In short, do v-for=" slide in slides": key=' slide.id' rather that v-for=" slide, index in slides": secret=' mark'.Do not make use of v-if on the origin element of slide components.API.Props.Ports.Slots.Explanation.default.Where your slides acquire injected.back-arrow.Switch out the default back icon. Port props:.disabled - True if in the beginning page when not knotting.next-arrow.Replace the nonpayment upcoming symbol. Slot props:.handicapped - Real if at last web page when not knotting.dot.Change the default pagination dots. Slot props:.index - The page mark that the dot embodies.disabled - Correct if dot embodies existing webpage.Strategies.Strategies.Explanation.following().Go ahead a webpage or even slide, depending on the paginate-by-slide uphold.back().Get back a web page or slide, relying on the paginate-by-slide set.goto( mark).Visit a mark. If paginate-by-slide is actually false, this equates to a webpage offset. If accurate, this relates to a slide balanced out.Activities.Find https://vue-ssr-carousel.netlify.app/events.Occasions.Explanation.adjustment( index ).Discharged when the inner index counter improvements.input.Same as improvement yet planned for usage along with v-model.press.Shot on mouse or contact down.launch.Fired on computer mouse or even retouch.bother: begin.Fired on beginning of pulling.nuisance: end.Fired on end of yanking.tween: beginning( mark ).Fired when the carousel begins tweening to it's ultimate position.tween: end( index ).Shot when the slide carousel has ended up tweening to it is actually location.