vue-slick-carousel无法在Node上执行appendChild

如何解决vue-slick-carousel无法在Node上执行appendChild

我的代码：

<template>
  <div>
    <VueSlickCarousel v-bind="settings">
      <div class="test">1</div>
      <div class="test">2</div>
      <div class="test">3</div>
      <div class="test">4</div>
      <div class="test">5</div>
      <div class="test">6</div>
    </VueSlickCarousel>
  </div>
</template>

<script>
import VueSlickCarousel from "vue-slick-carousel";
import "vue-slick-carousel/dist/vue-slick-carousel.css";
// optional style for arrows & dots
import "vue-slick-carousel/dist/vue-slick-carousel-theme.css";

export default {
  name: "MyComponent",components: { VueSlickCarousel },data() {
    return {
      settings: {
        arrows: true,dots: true,infinite: false,speed: 500,slidesToShow: 4,slidesToScroll: 4,initialSlide: 0,responsive: [
          {
            breakpoint: 1024,settings: {
              slidesToShow: "2",arrows: false
       

这是我向断点添加多个项目时遇到的错误。
如果只有一个成员，我不会出错。

错误消息：