swiper出现划不动解决办法

直接上代码

html部分

// HTML
<div className="swiper-container swipertwo">
          <div className="swiper-wrapper two">
            {home.types.map(item=>
              <div className="swiper-slide"  >
                <div className={Styles.Listone} key={item.id} onClick={()=>this.getTypeList(item.id)}>
                  <span className={Styles.Listname}>
                        <img src={imgjpg}/>
                        <p>{item.type}</p>
                  </span>
                </div>
              </div>
            )}
          </div>
        </div>

修改之前
在这里插入图片描述

swiper部分

// An highlighted block
var swiper = new Swiper('.swipertwo', {
      slidesPerView : 5,
      slidesPerGroup : 1,
      //加上这三句话即可
      paginationClickable: true,
      observer:true,//修改swiper自己或子元素时,自动初始化swiper
      observeParents:true,//修改swiper的父元素时,自动初始化swiper

    });
  }
</script>

修改之后
在这里插入图片描述

问题解决了。

  • 3
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值