Question: How to display a multilayer layer slide

[ouraios]

Hi, I'd like to use vue-carousel but to display multiple element on two rows, something like one slide contain two elements one under another. This feature is not currently implemented how would it be possible to implement it ?

[quinnlangille]

Hey @ouraios, there are many ways to go about this. Using a component as a slide is probably the easiest. Let me know how it goes!

[ouraios]

I mean i have an array in my component data, and i want items of the array to be visible on your vue-carousel component but i want to display two items vertically per slide. Your vue-carousel actually dont provide this feature, maybe its me on my own to do it but i want to manipulate the items of my array as i wish. For example i want to display group or products in the carousel and when selecting one group of product i want the carousel to show the products who belong to this group of product. But i want the items to be displayed on two rows in only one carousel. How that's possible to achieve ? (I dont know if i'm understandable in my english, sorry i'm french)

[satuweb]

I need the same issue, I would display two row of items (6 per page). I try to set flex-wrap on VueCarousel-inner module, but dosn't work. Have you got any suggestions? @quinnlangille thanks!

[quinnlangille]

As I mentioend above, a custom component being fed into the slide should work - something like

<template>

    <slide1> { ... props that dictate top slide content here } </slide1>
    <slide2> { ... props that dictate bottom slide content here } </slide2>

</template>

This is one of many ways you could achieve this effect, but it would cause a reorganization or maybe a computed property to transform the data. I'll be happy to see what solution you'll think of, if it's cool post it back here and I can include it as an example!