vue-owl-carousel不能与v-for一起工作。

Posted 2021-03-19

我使用的是vue-owl-carousel，每个项目都是用v-for填充的。

<carousel>
  <div v-for="index in myArr">
    {{index}}
  </div>
</carousel>

...

<script>
 export default {
   name: "myComponent",
   data: {
     myArr: []
   },
   mounted: {
     for(let i = 1; i < 6; i++) myArr.push(i);
   }
 }
</script>

但它没有工作，它只是工作在静态元素上，比如这个。

<carousel>
  <div>1</div>
  <div>2</div>
  <div>3</div>
  <div>4</div>
  <div>5</div>
</carousel>

我应该如何管理这个问题？

请教

答案

已编辑。

Add method 为您的阵列初始化，然后选择 mounted 钩子来初始化pushedArray，当组件准备好时。

我的Fiddle。https:/jsfiddle.netjwaLsnk41

注意，这只适用于没有对象的普通数组。干杯