vue2-siema

Usage

With all!
Note: all props and ref are optional.

        <siema ref="siema" class="siema" :current.sync="curSlide" :playing.sync="playing" auto-play :ready="true" :options="options"  @init="initFunc" @change="changeFunc">

         <div class="slide">
          <p>Hi, I'm slide 1</p>
         </div>
        
         <div class="slide">
          <p>Hi, I'm slide 2</p>
         </div>
        
         <div class="slide">
          <p>Hi, I'm slide 3</p>
         </div>
        
        </siema>
      

the options object

For more infomation see the siema page.

          options {
            selector: '.siema', Not needed.
            duration: 200,
            easing: 'ease-out',
            perPage: 1,
            startIndex: 0,
            draggable: true,
            multipleDrag: true,
            threshold: 20,
            loop: false,
            rtl: false,
            onInit: () => {}, Use @init 
            onChange: () => {}, Use @change
          }
      

Methods

Added wraps to plugin so you can use it:

this.$refs.siema.init() initialize

From the plugin

    
          this.$refs.siema.prev( slide = 1, callback)
          
          this.$refs.siema.next( slide = 1, callback)
          
          this.$refs.siema.goTo( index, callback)
          
          this.$refs.siema.remove( index, callback)
          
          this.$refs.siema.insert( item, index, callback)
          
          this.$refs.siema.prepend( item, callback)
          
          this.$refs.siema.append( item, callback)

          destroy(restoreMarkup = false, callback)

      

Extras

Autoplay

          this.$refs.siema.stop() Stop auto play
    
          this.$refs.siema.play(time = 6000)
      

More...

Data sync

          :playing.sync="playing"
      

boolean: check if autoplay is active

          :current.sync="curSlide"
      

Integer: The current slide

          :ready="false"
      

Boolean: Default true. Use if you need to disable on mounted(), and then start manualy:

          this.$refs.siema.init()
      

See This demo for more info.