vue-awesome-swiper初始化的时候loop没有进行回环轮播怎么解决？

Question

代码如下：

<script lang="ts">
import { Component, Vue } from 'vue-property-decorator';
import 'swiper/dist/css/swiper.css';
import { swiper, swiperSlide } from 'vue-awesome-swiper';

@Component({
  components: {
    swiper,
    swiperSlide,
  },
})
export default class HomeBanner extends Vue {
  private swiperOption: any = {
    loop: true,
    autoplay: true,
    pagination: {
        el: '.swiper-pagination',
    },
  };

  private callback() {
    console.log('run');
  }
  private toUrl(url: string) {
    this.$router.push(url);
  }
  get banner() {
    return this.$store.state.homeBanner;
  }
}
</script>

首页有一个轮播，每次刷新页面的时候loop都不生效，进入二级页面返回首页之后就生效了。
debugger发现是因为我的homeBanner是从后台获取的，初始化轮播的时候还没有取到数据，是一个空数组。
有什么办法能让我取到数据之后让loop生效么？

Answer 1

//轮播设置
swiperOption: {
　　direction: ‘vertical‘,
　　observer:true,//修改swiper自己或子元素时，自动初始化swiper 
　　observeParents:true,//修改swiper的父元素时，自动初始化swiper 
　　loop:true,
　　autoplay: {
　　　　delay: 2000,
　　disableOnInteraction: false
　　}
}

需要添加上两个属性,这样达到一个初始化swiper的目的
`observer:true,//修改swiper自己或子元素时，自动初始化swiper
observeParents:true,//修改swiper的父元素时，自动初始化swiper `