用avalon框架怎么做轮播图?

avalon这个框架其实特别的小众,做个轮播图呢?在github上的例子只有一个,而且功能特别的少,有的引入的插件与avalon里面的指令又不兼容,所以找了一个owl-carousel,目前实现了移动端的自动轮播和手滑动,其中导航点还在尝试~

    <div class="page-banner owl-carousel owl-theme owl-loaded owl-drag" id="slideshow"  style="max-width: 37.5rem;" >

             <div class="item" style="margin:0" id="move6"   onClick="javascript:;" >
                <a class="img" ms-attr="{href:@link1}">
                      <img ms-attr="{src: @carousel1}">
                </a>
            </div>
            <div class="item" id="move2" style="margin:0" >
                <a class="img" ms-attr="{href:@link2}" >
                      <img ms-attr="{src: @carousel2}" >
                </a>
            </div>
             <div class="item" id="move3" style="margin:0" >
                <a class="img" ms-attr="{href:@link3}">
                      <img ms-attr="{src: @carousel3}"  >
                </a>
            </div>
             <div class="item" id="move4" style="margin:0"  >
                <a class="img" ms-attr="{href:@link4}">
                      <img ms-attr="{src: @carousel4}" >
                </a>
            </div>
             <div class="item" id="move5" style="margin:0" >
                <a class="img" ms-attr="{href:@link5}">
                      <img ms-attr="{src: @carousel5}" >
                </a>
            </div>             

   </div>

  getlunbo:function(){
             $.get('/getBannerInfo', {

             }, function(res) {
                if (res.code == '') {
                   vmi.carousel1=res.data[].image
                   vmi.carousel2=res.data[]&&res.data[].image
                   vmi.carousel3=res.data[]&&res.data[].image
                   vmi.carousel4=res.data[]&&res.data[].image
                   vmi.carousel5=res.data[]&&res.data[].image
                   vmi.link1=res.data[].link
                   vmi.link2=res.data[]&&res.data[].link
                   vmi.link3=res.data[]&&res.data[].link
                   vmi.link4=res.data[]&&res.data[].link
                   vmi.link5=res.data[]&&res.data[].link

                   if(!res.data[]){
                      $('.page-banner  #move2').remove()
                   }
                   if(!res.data[]){
                      $('.page-banner  #move3').remove()     

                   }
                   if(!res.data[]){
                      $('.page-banner  #move4').remove()
                   }
                  if(!res.data[]){
                      $('.page-banner  #move5').remove()
                   }
                   if(res.data.length==''){
                       $('#move6').remove()
                   }else{
                       $('#move1').remove()
                       vmi.lunbodiaoyong()
                   } 

                }else if(res.code==""){
                    $('#slideshow').remove()
                    $('#move1').remove() 

                }
            })

        },
        lunbodiaoyong:function(){
            $('#slideshow').owlCarousel({
                items: ,
                loop:true,
                lazyLoad:true,
                autoplay:true,
                autoplayTimeout:,
                // pagination:true,
                dots:true,
                // nav:true,
                navText:['<i class="fa fa-angle-left"></i>','<i class="fa fa-angle-right"></i>'],

           });
        },

    })
    avalon.filters.getday = function(times) {
        return Math.round(times / )
    }

    vmi.$watch('onReady', function() {
        vmi.getlunbo()
        vmi.getcurrentdate()
        vmi.getduelists()
        vmi.currentSelect = vmi.setting.currenttry;
        vmi.tryGoodsList()
        // vmi.awardPeople()
        vmi.checkUserAwardStatus()

    })
因为这里我们要求是图片是五张任意上的,如果只有一张的话就不轮播,这里owl-carousel与ms-for这样的指令是不兼容的~