vue swiper轮播图不显示 pagination 小圆点，navigation前进后退按钮

<div class="swiper-pagination" slot="pagination"></div>
<div class="swiper-button-prev" slot="button-prev"></div>
<div class="swiper-button-next" slot="button-next"></div>
// 在swiper插件里面插入 slot="pagination" slot="button-prev" slot="button-next" 三个属性
swiperOptions:{ 
    // 前进后退按钮显示
    navigation: { 
        nextEl: ".swiper-button-next", 
        prevEl:".swiper-button-prev", 
    }, 
    // 分页显示
    pagination: { 
        el: ".swiper-pagination", 
        dynamicBullets: true,
        clickable: true, 
    }, 
    // 自动切换
    autoplay: { 
        delay: 4000, 
        stopOnLastSlide: false, 
        disableOnInteraction:true, 
    }, 
    // 无限循环
    loop: true, 
    // 设置为true开启Swiper的视差效果，内容在切换时更有层次感。
    parallax: true, 
    // 切换效果
    effect: "fade", 
    // 开启焦距功能：双击slide会放大/缩小，并且在手机端可双指触摸缩放
    zoom: true,
}