Ajaxコール後にSlickが動作しない

Question

これは、hereと同様の質問です。私は成功したajaxコールの後に私の滑らかなカルーセルの仕事を作ろうとしています。そこにすべてのソリューションを試してみましたが、それでも私のために動作していないようです。

.reviews-ページカルーセルツルツル

$('.reviews-page-carousel').slick({ 
    arrows: false, 
    slidesToShow: 1, 
    variableWidth: true, 
    centerPadding: '10px' 
}); 

AJAX呼び出し、この同様

$.ajax({ 
    type: "GET", 
    url: review_url + "?page=" + page, 
    success: function(result) { 
     $('.reviews-page-carousel').slick('unslick'); /* ONLY remove the classes and handlers added on initialize */ 
     $('.reviews-page-carousel').slick(getSliderSettings()); /* Initialize the slick again */ 
    } 
}); 

の両方が、このエラーを与える試みた

$.ajax({ 
    type: "GET", 
    url: review_url + "?page=" + page, 
    success: function(result) { 
     $('.reviews-page-carousel').slick('unslick').slick('reinit'); 
    } 
}) 

：

捕捉されない例外TypeErrorを：できない未定義の読み取りプロパティ 'unslick'

Answer 1

要求を呼び出した後、滑らかなスライダを初期化するためにタイムアウトを設定します。

var options = { 
    arrows: false, 
    slidesToShow: 1, 
    variableWidth: true, 
    centerPadding: '10px' 
} 

$.ajax({ 
    type: "GET", 
    url: review_url+"?page="+page, 
    success: function(result){ 
     setTimeout(function() { 
      $(".reviews-page-carousel").slick(options) 
     }, 500); 
    } 
}) 

更新：開始時に滑らかなスライダを初期化しないでください。時間切れでajaxの後に初期化するだけです。それはあなたのために働くはずです。

Answer 2

ソリューション

var options = { 
    arrows: false, 
    slidesToShow: 1, 
    variableWidth: true, 
    centerPadding: '10px' 
} 

アヤックス

$.ajax({ 
     type: "GET", 
     url: review_url+"?page="+page, 
     success: function(result){ 

      setTimeout(function() { 
       $(".reviews-page-carousel").not('.slick-initialized').slick(options) 
      }, 500);