antonreshetov / vue-glide

A slider and carousel as vue component on top of the Glide.js
https://antonreshetov.github.io/vue-glide/
MIT License
269 stars 39 forks source link
carousel component glide slider vue vue-components vuejs

Vue Glide

npm bundle size

Vue component on top of the Glide.js

Documentation

https://antonreshetov.github.io/vue-glide

Install

NPM

Installing with npm is recommended and it works seamlessly with webpack.

npm i vue-glide-js

Download

You can download latest version from the Github: Download

Quick Start

Global

To use in your project, just import vue-glide and install into Vue.

import Vue from 'vue'
import App from './App.vue'
import VueGlide from 'vue-glide-js'
import 'vue-glide-js/dist/vue-glide.css'

Vue.use(VueGlide)

new Vue({
  el: '#app',
  render: h => h(App)
})

On demand

<template>
  <div id="app">
    <vue-glide>
      <vue-glide-slide v-for="i in 10" :key="i">
        Slide {{ i }}
      </vue-glide-slide>
    </vue-glide>
  </div>
</template>

<script>
  import { Glide, GlideSlide } from 'vue-glide-js'

  export default {
    components: {
      [Glide.name]: Glide,
      [GlideSlide.name]: GlideSlide
    }
  }
</script>

License

MIT © 2018-present Anton Reshetov