87

Vue component on top of the Glide.js - Slider/Carousel

 5 years ago
source link: https://www.tuicool.com/articles/hit/q63uAzR
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 Glide

Vue component on top of the Glide.js

fI7rmej.png!web

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


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK