---

<template>
  <slick ref="slick"  :options="slickOptions" >
    <!-- <img :src="`https://image.tmdb.org/t/p/w500${text.poster_path}`"> -->

        <img src="https://fructcode.com/uploads/img/blog/436ddfe65f6e04e72928b1dcfae0567b/9407ed7ea2_fructcode.jpg">
        <img src="https://fructcode.com/uploads/img/blog/436ddfe65f6e04e72928b1dcfae0567b/9407ed7ea2_fructcode.jpg">
        <img src="https://fructcode.com/uploads/img/blog/436ddfe65f6e04e72928b1dcfae0567b/9407ed7ea2_fructcode.jpg">
        <img src="https://fructcode.com/uploads/img/blog/436ddfe65f6e04e72928b1dcfae0567b/9407ed7ea2_fructcode.jpg">
        <img src="https://fructcode.com/uploads/img/blog/436ddfe65f6e04e72928b1dcfae0567b/9407ed7ea2_fructcode.jpg">
        <img src="https://fructcode.com/uploads/img/blog/436ddfe65f6e04e72928b1dcfae0567b/9407ed7ea2_fructcode.jpg">

  </slick>
</template>

<script>
import Slick from 'vue-slick';

export default {

    components: { Slick },
    data() {
            return {
                    slickOptions: {
                        //options can be used from the plugin documentation
                        slidesToShow: 1,
                        infinite: true,

                    }
            }
    },
    // All slick methods can be used too, example here
    methods: {
            next() {
                    this.$refs.slick.next()
            },
            prev() {
                    this.$refs.slick.prev()
            },
            reInit() {
                    // Helpful if you have to deal with v-for to update dynamic lists
                    this.$refs.slick.reSlick()
            }
    }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>

---

---

---