美文网首页
如何解决swiper.js的freeMode配置不生效

如何解决swiper.js的freeMode配置不生效

作者: 用IE的都是狗 | 来源:发表于2022-12-07 14:43 被阅读0次

    在vue3项目中通过npm的方式使用swiper 8,设置freeMode之后发现不生效。
    原因为FreeMode被分为单独模块了,需要引入模块才生效。

    注意引入的 FreeMode 大小写

    // "swiper": "^8.4.5"
    import { FreeMode } from 'swiper'
    import { Swiper, SwiperSlide } from 'swiper/vue'
    import 'swiper/css'
    
    const swiperOption = {
      freeMode: true,
      modules: [FreeMode],
    }
    

    然后通过 v-bind 绑定多个属性

    <Swiper v-bind="swiperOption">
      <SwiperSlide>...</SwiperSlide>
      <SwiperSlide>...</SwiperSlide>
      <SwiperSlide>...</SwiperSlide>
    </Swiper>
    

    相关文章

      网友评论

          本文标题:如何解决swiper.js的freeMode配置不生效

          本文链接:https://www.haomeiwen.com/subject/mxnwfdtx.html