jhswiper

jhswiper

Project setup

安装
npm install jhswiper

Compiles and hot-reloads for development

npm run serve

全局导入注册

import JhSwiper from 'jhswiper'
Vue.use(JhSwiper);

Compiles and minifies for production

npm run build

html使用示例

    <jh-swiper :config="config"></jh-swiper>

config示例

export default {
  data () {
    return {
      config:{
            // direction: 'vertical', // 垂直切换选项
            loop: true, // 循环模式选项

            // 如果需要分页器
            pagination: {
                el: '.swiper-pagination',
            },

            // 如果需要前进后退按钮
            navigation: {
                nextEl: '.swiper-button-next',
                prevEl: '.swiper-button-prev',
            },

            // 如果需要滚动条
            scrollbar: {
                el: '.swiper-scrollbar',
            },
            size:{
              width:"600px",
              height:"300px",
              'background-color':"skyblue"
            }
      }
    }
  }
}

Customize configuration

See Configuration Reference.