Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Taro3 没法阻止onTouchMove事件冒泡 #7234

Closed
wforguo opened this issue Aug 2, 2020 · 5 comments
Closed

Taro3 没法阻止onTouchMove事件冒泡 #7234

wforguo opened this issue Aug 2, 2020 · 5 comments
Labels
F-react Framework - React T-weapp Target - 编译到微信小程序 V-3 Version - 3.x

Comments

@wforguo
Copy link

wforguo commented Aug 2, 2020

相关平台

微信小程序

复现仓库

https://github.com/wforguo/taro-issue
小程序基础库: 2.12.0
使用框架: React

复现步骤

代码


export default class Index extends Component {
  onTouchMove = (e) => {
    console.log(e);
    e.stopPropagation();
  };

  render() {
    return (
      <View className='login' onTouchMove={this.onTouchMove.bind(this)}>
        <View className='login-inner'>弹层model</View>
      </View>
    )
  }
}


实际并没有效果,没有阻止冒泡

打印事件对象属性,如下:

  • Taro3打印的没有 stopPropagation 方法

事件属性

  • 但是在Taro2 打印的有 stopPropagation 方法
    事件属性

之前使用Taro2可以正常 stopPropagation,Taro是不是不支持,希望解决

期望结果

使用touchStart在事件接受中可以阻止事件的冒泡,也就是事件属性中包含 stopPropagation方法

实际结果

没有阻止事件冒泡,没有 stopPropagation方法

环境信息


👽 Taro v3.0.0


  Taro CLI 3.0.0 environment info:
    System:
      OS: macOS 10.15.6
      Shell: 3.2.57 - /bin/bash
    Binaries:
      Node: 12.13.0 - /usr/local/bin/node
      Yarn: 1.22.4 - ~/.yarn/bin/yarn
      npm: 6.14.7 - /usr/local/bin/npm
    npmPackages:
      @tarojs/components: 3.0.0 => 3.0.0 
      @tarojs/mini-runner: 3.0.0 => 3.0.0 
      @tarojs/react: 3.0.0 => 3.0.0 
      @tarojs/runtime: 3.0.0 => 3.0.0 
      @tarojs/taro: 3.0.0 => 3.0.0 
      @tarojs/webpack-runner: 3.0.0 => 3.0.0 
      babel-preset-taro: 3.0.0 => 3.0.0 
      eslint-config-taro: 3.0.0 => 3.0.0 
      react: ^16.10.0 => 16.13.1 


补充信息

真机和模拟器都不行,微信小程序环境

在这里我需要使用,上拉加载更多,列表容器是没有设置高度的

@taro-bot2 taro-bot2 bot added F-react Framework - React T-weapp Target - 编译到微信小程序 V-3 Version - 3.x labels Aug 2, 2020
@BuleB
Copy link
Contributor

BuleB commented Aug 4, 2020

这是个已知问题issues

@Arima666
Copy link

Arima666 commented Aug 17, 2020

遇到相同的问题,函数组件中无法成功stopPropagation!
const stopPropagation = (e: ITouchEvent) => { e.stopPropagation(); e.preventDefault(); }; return <View className="mask" onTouchMove={stopPropagation}></View>;

@vsme
Copy link

vsme commented Aug 31, 2020

希望尽快解决,加油!

@Chen-jj
Copy link
Contributor

Chen-jj commented Sep 3, 2020

#5984

@Chen-jj Chen-jj closed this as completed Sep 3, 2020
@wangdanuo
Copy link

issue:#7004#5984#7234,#7009均无准确解决方案,大佬们不要再贴了

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
F-react Framework - React T-weapp Target - 编译到微信小程序 V-3 Version - 3.x
Projects
None yet
Development

No branches or pull requests

6 participants