VueJS: using nested components in jquery plugin

Question

VueJS: using nested components in jquery plugin

So, I'm trying to use the slick.js plugin for a carousel in the vue component. This works when there are no nested vue components. However, the moment I try to use the fact that the nested div wrapper that slick uses for the slide track is built, but outside of the loop. Basically, albums simply repeat the list of albums and transfer all parameters to sub-albums. Everything is initiated, the spots work, the components work, but they are not inside the slide track, which means that they do not receive carousel processing.

I searched for instructions, slots, etc., but to no avail there is no information about this.

Here is my HTML:

<div class="albums-component">
    <div class="albums-container" v-slick>
        <album v-for="album in albums.data"
               :album="album"
               file-types="audio,video,image"
               :fixed-size="fixedSize"
               :show-rotator="showRotator"
               :display-limit="3"
               :columns-lg="columnsLg"
               :columns-md="columnsMd"
               :columns-sm="columnsSm"
               :center-images="centerImages"
               :presenter-enabled="true"
               :manage-enabled="manageEnabled">
        </album>
    </div>
    <button class="left add-button" v-on:click="createAlbum"> + </button>
</div>

Here is my slick directive:

Vue.directive('slick', {
twoWay: true,
priority: 1000,

params: ['options'],

bind: function () {
    var self = this;
    setTimeout(function(){
        $(self.el).slick({
            slidesToShow: 1,
            slidesToScroll: 1,
            elementsExist: true,
            arrows: false,
            fade: true
        });
    }, 1000);

},
update: function (value)
{

},
unbind: function ()
{

}