• 设为首页
  • 加入收藏
  • 我要投稿
  • 联系站长
  • 网站模板技术交流
当前位置:模板网首页 > 建站教程 > JS、jQ >  手机浏览器下better-正文

手机浏览器下better-scroll中click事件,链接无效的问题

作者:网页模板
类型:文章教程
点击次数:
发布时间:2018-09-29 11:09
分享到:
使用better-scroll时,大多数会出现一个问题,就是在大的div里面的a 链接或者click事件都不用了,这是因为BScroll禁用了click事件,在初始化时,加入参数:click:true,即可。如下:

html部分
<div ref="wrapper" class="list-wrapper">
  <div class="setting-list" ref="setting" >
    <div class="setting-list-li" v-for="(value,key) in theme">
      <router-link :to="`/theme/${value.c_type}`" @click.native="change" class="item">
      </router-link>
    </div>
  </div>
</div>
js部分
import BScroll from 'better-scroll'
export default {
    mounted () {
      this.$nextTick(function () {
        setTimeout(() => {
          const options = {
            scrollY: false, // 因为scrollY默认为true,其实可以省略
            scrollX: true,
            mouseWheel: true,
            click: true,
            taps: true
          }
          this.scroll = new BScroll(this.$refs.wrapper, options)
        }, 20)
      })
    }
}
因为 better-scroll 会阻止原生的 click 事件,我们可以设置 tap 为 true,它会在区域被点击的时候派发一个 tap 事件
(责任编辑:网页模板)
  • 本文标签:
  • BScroll click
Chrome浏览器修改user-agent伪装其它浏览器
addEventListener绑定click和直接写onclick的区别