zoukankan      html  css  js  c++  java
  • better scroll在vue2移动端中点击事件触发两次

    注意:

      better-scroll会将点击事件去掉,如果滚动部分需要有点击事件,需要在参数里加上click:true。

      同时,在PC上或某些手机端,由于未成功将touchend事件move掉,点击事件会执行两次。

      better-scroll派发的event事件和原生js的event有属性上的区别,其中有一个属性为event._constructed。better-scroll派发的事件中event._constructed为true,原生点击事件中没有这个属性。

    如果在better-scroll滚动的页面,有click点击事件,需要判断

    此时在点击事件中,我也已经判断了event._constructed, 在移动端还是会点击两次

      methods: {
        toggleFavorite(event) {
          // console.log(event._constructed, window.location.search);
          if (!event._constructed) {
            return;
          }
    
          // console.log('qqq')
          this.favorite = !this.favorite;

    解决办法,需要查看创建better-scroll的逻辑,明白了,此时判断是否已经创建过scroll, 创建过后需要刷新scroll即可,不然创建多次scroll,会有多次点击

        _initScroll() {
          this.sellerScroll = new BSscroll(".seller", {
            click: true
          });
    
        },

    解决后

     _initScroll() {
          // console.log("aaa");
          // 判断是否有创建scroll
          if (!this.sellerScroll) {
            this.sellerScroll = new BSscroll(".seller", {
              click: true
            });
          } else {
            this.sellerScroll.refresh();
          }
        },
      watch: {
        // 监视数据,创建scroll
        sellers() {
          this.$nextTick(() => {
            this._initScroll();
       
          });
        }
      },
  • 相关阅读:
    Codeforces 1163E 高斯消元 + dfs
    Codeforces 1159E 拓扑排序
    Codeforces 631E 斜率优化
    Codeforces 1167F 计算贡献
    Codeforces 1167E 尺取法
    Gym 102007I 二分 网络流
    Codeforces 319C DP 斜率优化
    Codeforces 1163D DP + KMP
    Comet OJ
    Vue 的响应式原理中 Object.defineProperty 有什么缺陷?为什么在 Vue3.0 采用了 Proxy,抛弃了 Object.defineProperty?
  • 原文地址:https://www.cnblogs.com/fsg6/p/14375689.html
Copyright © 2011-2022 走看看