14

🚥 Vue Slick Carousel with True SSR Written for Faster Web

 4 years ago
source link: https://github.com/gs-shop/vue-slick-carousel
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

vue-slick-carousel

:traffic_light: Vue Slick Carousel with True SSR Written for Faster Luxstay . This Is a Port of react-slick .

zyeYFvM.gif

:art: Features

simple center mode multiple rows aueArum.png!webIZZZryi.png!web3quU7nm.png!webUzaA7zZ.png!web variable width vertical lazy load synced sliders BNf2MjI.png!webuYj6F3J.png!webz6JNZjJ.png!webraYzqav.png!web

vue-slick-carousel inherits the long-loved slick-carousel features, offers a variety of functions. It has been completely rewritten as a vue component. If you were trying to use the click-carousel in the vue, it would be a perfect choice. You can use it in a vue component manner without any disparity. It also makes it easy to solve difficult problems such as custom arrows/dots.

It is designed to support SSR from the start. So far, we have confirmed that the vue-slick-carousel is the only carousel that supports SSR with rich features. If you value website performance, you are in the right place.

Find out all available features on setting props and see how that works on examples .

:truck: Installation

yarn/npm

npm i vue-slick-carousel
# or
yarn add vue-slick-carousel

cdn

# latest
https://unpkg.com/vue-slick-carousel

:rocket: Quick Start

See API & Examples to learn advanced usage.

<template>
  <div>
    <VueSlickCarousel :arrows="true" :dots="true">
      <div>1</div>
      <div>2</div>
      <div>3</div>
      <div>4</div>
    </VueSlickCarousel>
  </div>
</template>

<script>
  import 'vue-slick-carousel/dist/slick.css'
  import 'vue-slick-carousel/dist/slick-theme.css'

  import VueSlickCarousel from 'vue-slick-carousel'

  export default {
    name: 'MyComponent',
    components: { VueSlickCarousel },
  }
</script>

:books: Docs

:bookmark: License

This software is licensed under the MIT .


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK