微信小程序组件的创建与引用

组件的创建

<view>
  <swiper class="myswiper" interval="{{interval}}" circular autoplay="{{autoplay}}"  indicator-dots="{{indicatorDots}}">
    <swiper-item>
    <image  mode="widthFix"  src="/image/lunb/1.jpeg"></image>
  </swiper-item>
  <swiper-item>
    <image  mode="widthFix" src="/image/lunb/2.jpg"></image>
  </swiper-item>
  <swiper-item>
    <image  mode="widthFix" src="/image/lunb/3.jpeg"></image>
  </swiper-item>
  </swiper>
</view>

1
2
3
4
5
6
7
8
9
10
11
12
13
14

Component({
    /**
     * 组件的属性列表
     */
    properties: {
        indicatorDots:{
            type:Boolean,
            value:false
        },
        autoplay:{
            type:Boolean,
            value:false
        },
        interval:{
            type:Number,
            value:5000
        },
        duration:{
            type:Number,
            value:500
        },
        swiperData:{
            type:Array,
            value:[]
        }
    },

    /**
     * 组件的初始数据
     */
    data: {

    },

    /**
     * 组件的方法列表
     */
    methods: {

    }
})

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42

组件引用