1***@163.com
1***@163.com
  • 发布:2019-08-05 22:43
  • 更新:2019-08-05 22:54
  • 阅读:2663

用uni-app模式编译后,轮播图无法滚动(包括手动和自动)

分类:uni-app

用的weex官网轮播图代码,除了px改成upx,效果为轮播图竖状堆叠,无法滚动
如果在slider标签里添加flex-direction: row;则横向堆叠,同样无法滚动

请问是写法改变还是bug?
weex官方轮播图代码:

<template>  
  <div>  
    <slider class="slider" interval="3000" auto-play="true">  
      <div class="frame" v-for="img in imageList" key="img">  
        <image class="image" resize="cover" :src="img.src"></image>  
      </div>  
    </slider>  
  </div>  
</template>  

<style scoped>  
  .image {  
    width: 700upx;  
    height: 700upx;  
  }  
  .slider {  
    margin-top: 25upx;  
    margin-left: 25upx;  
    width: 700upx;  
    height: 700upx;  
    border-width: 2upx;  
    border-style: solid;  
    border-color: #41B883;  
  }  
  .frame {  
    width: 700upx;  
    height: 700upx;  
    position: relative;  
  }  
</style>  

<script>  
  export default {  
    data () {  
      return {  
        imageList: [  
          { src: 'https://gd2.alicdn.com/bao/uploaded/i2/T14H1LFwBcXXXXXXXX_!!0-item_pic.jpg'},  
          { src: 'https://gd1.alicdn.com/bao/uploaded/i1/TB1PXJCJFXXXXciXFXXXXXXXXXX_!!0-item_pic.jpg'},  
          { src: 'https://gd3.alicdn.com/bao/uploaded/i3/TB1x6hYLXXXXXazXVXXXXXXXXXX_!!0-item_pic.jpg'}  
        ]  
      }  
    }  
  }  
</script>
2019-08-05 22:43 负责人:无 分享
已邀请:
DCloud_heavensoft

DCloud_heavensoft

用uni-app编译模式,要用uni-app的组件,swiper,不能使用weex的组件。

  • 1***@163.com (作者)

    请问有swiper轮播图的例子吗?

    2019-08-05 23:00

  • 1***@163.com (作者)

    懂了,和vue那块的swiper一样用法

    2019-08-05 23:10

  • 1***@163.com (作者)

    请问swiper以后会像weex一样可以自由设定indicator的位置吗?现在好像只能用默认位置,设计上有点不方便

    2019-08-05 23:20

  • DCloud_heavensoft

    回复 1***@163.com: 会与vue里的swiper拉齐,可以自定义

    2019-08-06 00:36

  • 1***@163.com (作者)

    回复 DCloud_heavensoft: 谢谢~

    2019-08-07 00:36

该问题目前已经被锁定, 无法添加新回复