老师,swiper标签里面的options属性中的data对象是干嘛用的?

来源:2-2 幻灯片组件--模拟数据

Raznov

2020-03-09 21:26:02

props: {
    // 轮播方向
    direction: {
      type: String,
      default: 'horizontal',
      validator (value) {
        return [
          'horizontal',
          'vertical'
        ].indexOf(value) > -1
      }
    },
    // 自动轮播的时间间隔
    interval: {
      type: Number,
      default: 3000,
      validator (value) {
        return value >= 0
      }
    },
    // 无缝滚动
    loop: {
      type: Boolean,
      default: true
    },
    // 分页器
    pagination: {
      type: Boolean,
      default: true
    },
    // data是什么意思?
    data: {
      type: Array,
      default () {
        return []
      }
    }
  }

如上,在base/swiper的index.vue文件中,props对象里的data是什么意思?

老师在视频中没有讲,也没有写上去,我照着视频写代码,然后控制台就提示错误了,Swiper也不能自动滑动。

找了很久的原因,才在源代码中发现多了

data: {
      type: Array,
      default () {
        return []
      }
    }

,我补上这段代码就没报错了。

写回答

1回答

好帮手慕夭夭

2020-03-10

同学你好,data就是swiper轮播的数据,即图片。可以输出看一下哦,如下:

http://img.mukewang.com/climg/5e66f26f09ab097712070405.jpg

后面会判断图片的长度,如果长度小于等于1 ,就把loop属性设置为false,即不需要循环轮播了。

http://img.mukewang.com/climg/5e66f32e0962464507740115.jpg

如果我的回答帮助到了你,欢迎采纳,祝学习愉快~

0

0 学习 · 10739 问题

查看课程