uni-app nvue文件scroll-view点击事件无效

uni-app nvue文件scroll-view点击事件无效

开发环境 版本号 项目创建方式
Mac 11.1 HBuilderX

示例代码：

<template>  
  <div class="div" [@tap](/user/tap)="addtap">  
    <scroll-view scroll-y="true" class="scroll" [@tap](/user/tap)="addtap1">  
      <view v-for="(item,index) in 10" :key="index">{{index}}</view>  
    </scroll-view>  
  </div>  
</template>  

<script>  
  export default {  
    methods: {  
      addtap() {  
        console.log(123);  
      },  
      addtap1(){  
        console.log(456);  
      }  
    }  
  }  
</script>  

<style>  
  .div {  
    background-color: #000000;  
    height: 800rpx;  
  }  

  .scroll {  
    width: 750rpx;  
    height: 500rpx;  
    background-color: #fff;  
  }  
</style>

更多关于uni-app nvue文件scroll-view点击事件无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

问题排查中，感谢您的反馈！

更多关于uni-app nvue文件scroll-view点击事件无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html


解决了吗??

在nvue中，scroll-view的点击事件确实存在一些特殊处理。根据你的代码，问题可能出在以下几个方面：

  1. nvue中scroll-view默认会拦截触摸事件，导致内部点击事件可能无法触发

解决方案可以尝试：

  1. 给scroll-view添加bounces="false"属性：
<scroll-view scroll-y="true" class="scroll" [@tap](/user/tap)="addtap1" bounces="false">
  1. 或者改用@click事件代替[@tap](/user/tap)：
<scroll-view scroll-y="true" class="scroll" @click="addtap1">
  1. 如果仍然无效，可以尝试在scroll-view内部包裹一个view并绑定事件：
<scroll-view scroll-y="true" class="scroll">
  <view [@tap](/user/tap)="addtap1">
    <view v-for="(item,index) in 10" :key="index">{{index}}</view>
  </view>
</scroll-view>
回到顶部