APICloud+Vue.js商城实战-2.使用APICloud内置轮播图组件UIScrollPicture

1、UIScrollPicture 轮播图组件
（1）文档地址
https://docs.apicloud.com/Client-API/UI-Layout/UIScrollPicture
（2）示例代码

var UIScrollPicture = api.require('UIScrollPicture');
UIScrollPicture.open({
    rect: {
        x: 0,
        y: 0,
        w: api.winWidth,
        h: api.winHeight / 2
    },
    data: {
        paths: [
            'widget://res/img/apicloud.png',
            'widget://res/img/apicloud-gray.png',
            'widget://res/img/apicloud.png',
            'widget://res/img/apicloud-gray.png'
        ],
        captions: ['apicloud', 'apicloud', 'apicloud', 'apicloud']
    },
    styles: {
        caption: {
            height: 35,
            color: '#E0FFFF',
            size: 13,
            bgColor: '#696969',
            position: 'bottom'
        },
        indicator: {
           dot:{
             w:20,
             h:10,
             r:5,
             margin:20
          },
            align: 'center',
            color: '#FFFFFF',
            activeColor: '#DA70D6'
        }
    },
    placeholderImg: 'widget://res/slide1.jpg',
    contentMode: 'scaleToFill',
    interval: 3,
    fixedOn: api.frameName,
    loop: true,
    fixed: false
}, function(ret, err) {
    if (ret) {
        alert(JSON.stringify(ret));
    } else {
        alert(JSON.stringify(err));
    }
});

2、