Topic: Video link instead of image in MDB Vue carousel
Expected behavior
Render video instead of image in MDB Vue carousel. If possible, what is the syntax? I found it in the standard version, but cannot find it in vue vesion.
Actual behavior
In the const items: we have src: (link to the wed image).
How do I change this to video link?
Resources (screenshots, code snippets etc.)
<template>
<MDBCarousel
v-model="carousel6"
:items="items6"
:indicators="false"
fade
/>
import { ref } from "vue"; import { MDBCarousel } from "mdb-vue-ui-kit"; export default { components: { MDBCarousel }, setup() { const items6 = [ { src: "https://mdbootstrap.com/img/Photos/Slides/img%20(15).webp", alt: "...", label: "First slide label", caption: "Nulla vitae elit libero, a pharetra augue mollis interdum." }, etc... ]; const carousel6 = ref(0); return { items6, carousel6 }; } };
pienaahj answered 2 years ago
Mateusz Trochonowicz staff pro premium priority answered 2 years ago
Hi! If you want to display video instead of an image, you have to put in item object value video
instead of src
. Following this there is another value, optional: videoType
. This is a new feature and missing description in documentation. Sorry about that.
Keep coding!
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- User: Free
- Premium support: No
- Technology: MDB Vue
- MDB Version: MDB5 2.0.0
- Device: iMac
- Browser: Chrome
- OS: macOS 10.15.7
- Provided sample code: No
- Provided link: Yes