首页 > 其他 > 详细

【weex开发】vue-swipe 滑动组件的使用

时间:2019-01-27 17:41:58      阅读:163      评论:0      收藏:0      [点我收藏+]

一,vue-swipe简介

vue-swipe 是饿了么团队开发的vue专用的轮播图插件;
可以实现简单的图片和view轮播,可控制动画时长,可限制手动滑动;
简而言之,可以实现轮播,也可以实现ppt样式的带动画的报告。

二,vue-swipe的引入

1,安装
$ npm install vue-swipe
2,引入依赖
import { Swipe, SwipeItem } from ‘vue-swipe‘;
 components: {
        swipe: Swipe,
        swipeItem: SwipeItem
    }
 <style lang="scss" scoped>

    @import ‘vue-swipe/dist/vue-swipe.css‘;

    ......

</style>
3,HTML使用
<swipe class="my-swipe" :auto="0" :continuous="false" :show-indicators="false" :disabled="true" :defaultIndex="0" ref="swipe" >
      <swipe-item class="slide1">1</swipe-item>
      <swipe-item class="slide2">2</swipe-item>
      <swipe-item class="slide3">3</swipe-item>
</swipe>

具体标签属性参考:https://github.com/ElemeFE/vue-swipe

参考文章:

https://github.com/ElemeFE/vue-swipe
https://segmentfault.com/a/1190000013909870
https://www.jianshu.com/p/c8788231ff2f

【weex开发】vue-swipe 滑动组件的使用

原文:https://www.cnblogs.com/neo-java/p/10327265.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!