Vuejs, как использовать Vue-Slick в дочернем компоненте?

Question

Мне нужно использовать более одного слайдера на моем сайте, я сделал это, импортировав Vueslick в дочерний компонент один за другим, но я хочу импортировать только одну библиотеку Slick, вот моя идея:

<pre><code>
<template>
  <div>
   <slider :slickOptionsSlider='slickOptionsSlider'></slider>
   <blogsuckhoe :slickOptionsBlogsuckhoe='slickOptionsBlogsuckhoe' ></blogsuckhoe>
 </div>
</template>

<script>
  data() {
    //import slick và child component
    return {
      slickOptionsSlider: {
        autoplay:true,
        infinite: true,
        slidesToShow: 3,
        slidesToScroll: 1,
        dots:false,
        arrows:false,
      },
      slickOptionsBlogsuckhoe: {
        autoplay:true,
        infinite: true,
        slidesToShow: 3,
        slidesToScroll: 1,
        dots:false,
        arrows:false,
      },
    };
  }
</script>

конечно, это не работает.Можешь мне помочь ?Спасибо .Извините за мой плохой английский.

Answer 1

Вы можете зарегистрировать его как глобальный компонент.

app.js

Vue.component('vue-slick',require('vue-slick').default);

Затем использовать его в любом месте внутри корневого элемента, внутри компонента или непосредственнов шаблоне лезвия.

SomeComponent.Vue

<vue-slick :options='options'></vue-slick>

some.blade.php

<vue-slick :options='@json($options)'></vue-slick>