Слайдер в слайдере slickGoTo() не работает

$('.sl').slick({ 
  slidesToShow: 3, 
  slidesToScroll: 1, 
  draggable: false, 
  beforeChange: function(){ 
    $('.sl-i').slick('slickGoTo', 0,  true); 
  } 
}); 
 
$('.sl-i').slick({ 
  slidesToShow: 2, 
  slidesToScroll: 1, 
  arrows: false 
});

.box { 
  max-width: 200px; 
  width: 100%; 
  height: 200px; 
  background: #ccc; 
} 
 
.sl-item { 
  padding: 5px; 
} 
 
.box-sm { 
  width: 50px; 
  height: 50px; 
  margin: 2px; 
  background: tomato; 
}

  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.min.css" /> 
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.1/jquery.min.js"></script> 
  <script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.min.js"></script> 
   
<div class="sl"> 
  <div class="sl-item"> 
    <div class="box">1</div> 
    <div class="sl-i"> 
      <div class="item"> 
        <div class="box-sm">1</div> 
      </div> 
      <div class="item"> 
        <div class="box-sm">2</div> 
      </div> 
      <div class="item"> 
        <div class="box-sm">3</div> 
      </div> 
    </div> 
  </div> 
  <div class="sl-item"> 
    <div class="box">2</div> 
    <div class="sl-i"> 
      <div class="item"> 
        <div class="box-sm">1</div> 
      </div> 
      <div class="item"> 
        <div class="box-sm">2</div> 
      </div> 
      <div class="item"> 
        <div class="box-sm">3</div> 
      </div> 
    </div> 
  </div> 
  <div class="sl-item"> 
    <div class="box">3</div> 
    <div class="sl-i"> 
      <div class="item"> 
        <div class="box-sm">1</div> 
      </div> 
      <div class="item"> 
        <div class="box-sm">2</div> 
      </div> 
      <div class="item"> 
        <div class="box-sm">3</div> 
      </div> 
    </div> 
  </div> 
  <div class="sl-item"> 
    <div class="box">4</div> 
    <div class="sl-i"> 
      <div class="item"> 
        <div class="box-sm">1</div> 
      </div> 
      <div class="item"> 
        <div class="box-sm">2</div> 
      </div> 
      <div class="item"> 
        <div class="box-sm">3</div> 
      </div> 
    </div> 
  </div> 
</div>