在vue项目使用swiper@6，解决分页器pagination不显示，导航navigation点击不跳转问题

默认情况下，Swiper 仅导出核心版本，没有附加模块（如导航、分页等）。所以你也需要导入和配置它们：

import引入之后，初始化swiper，仍需要加入配置。

import Swiper, { Navigation, Pagination } from 'swiper';

import 'swiper/swiper-bundle.css';

 

 Swiper.use([Navigation, Pagination]);

 

export default {

  mounted() {

    setTimeout(() => {

      let mySwiper = new Swiper(".swiper-container", {

        loop: true,

        pagination: {

          el: ".swiper-pagination",

          clickable:true,

        },

        autoplay: true,

        navigation: {

          nextEl: ".swiper-button-next",

          prevEl: ".swiper-button-prev",

        },

      });

    }, 2000);

  },

}

如果要使用所有模块（捆绑包）导入 Swiper，则应从swiper/bundle以下位置导入：

 import Swiper from 'swiper/bundle';

详细情况查看官网：https://swiperjs.com/get-started