Question

我有一组通过Firebase引入的数据。我想在旋转木马中显示Firebase数据中引用的图像。我已经设置了一个指令（下面）我遇到的问题是v-for。该指令在v-for之前运行，因此，不存在旋转木马作为项目不存在。

指令：

  directives: {
    slick: {
      inserted: function (el) {
        $(el).slick({
          arrows: false,
          autoplay: true,
          autoplaySpeed: 4000,
          speed: 2000,
          fade: true,
          pauseOnHover: false
        })
      }
    }
  }

HTML

<div v-slick>
  <div v-for="sponsor in sponsors">
    {{sponsor.name}}
  </div>
</div>

Answer 1

等待实例化指令，直到sponsors包含数据。

一种快速而又脏的方法：

<div v-slick v-if="sponsors.length"> ... </div>

v-for后的Vue指令

1 个答案: