2016-11-25 38 views
0

我想在riotjs應用程序上實現flexslider。滑塊工作正常,但是當我爲滑塊設置自定義項目寬度時,它不會。據文件,它應該工作。flexslider項目寬度不能與riotjs

self.on('updated', function(){ 
    $('.flexslider').flexslider({ 
    animation: "slide", 
//    itemWidth: 210, 
//    itemMargin: 5, 
      controlsContainer: ".flex-container", 
      start: function (slider) { 
      $('.total-slides').text(slider.count); 
      }, 
      after: function (slider) { 
      $('.current-slide').text(slider.currentSlide); 
      } 
    }); 
}); 

防暴組件:

<rsc-component id="dropBox" class="mybox col-lg-12"> 
    <div class="flexslider"> 
     <ul class="slides"> 
      <li> 
       <img src="../images/slide1.jpg" alt=""/> 
      </li> 
      <li> 
       <img src="../images/slide2.png" alt=""/> 
      </li> 
     </ul> 
    </div> 
</rsc-component> 
+0

如果您從暴亂組件中刪除col-lg-12類,它會起作用嗎? – attomos

+0

@attomos不,它不 – Satyadev

回答

0

給你flexslider的名稱,是指它的內部,而不是打獵使用jQuery它。

<rsc-component id="dropBox" class="mybox col-lg-12"> 
    <div class="flexslider" name="flexslider"> 
    <ul class="slides">...</ul> 
    </div> 
<script> 
... 
//store reference to flexslider 
this.on('mount',function(){ 
this.$flexslider = $(this.flexslider); // from the name property in template 
}); 

this.on('updated',function(){ 
// I would have at a guess that the flexslider needs to recalc itself, so 
// destroy it and regenerate. 
this.$flexslider.detach().flexslider({...}) 
}); 

</script> 
</rsc-component>