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>
</code></pre>

当然，它不起作用。你能帮助我吗 ？谢谢你 。对不起我的英语不好。

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>