jd-opensource / jd-opensource/taro-ui
taro-ui 3.0.0-alpha.3 浮窗组件 AtFloatLayout 在微信小程序里页面过长的情况下滚动穿透了
- Dominant language
- TypeScript
- Stars
- 4.7k
- Forks
- 740
- PR merge metrics
- No merged PRs in 30d
Description
### Taro UI 版本信息
v2.3.4
### 问题描述
我在ui库源码中看到了对于组件的处理,有绑定onTouchMove函数阻止冒泡,但是编译后在真机调试时在开启AtFloatLayout的情况下并没有阻止页面滚动
### 复现步骤
1. git clone https://github.com/Laev/taro-demo.git
2. cd taro-demo
3. npm i
4. npm run dev:weapp
### 复现代码
https://github.com/Laev/taro-demo/blob/master/src/pages/index/index.tsx
### 报错信息
无
### 系统信息
👽 Taro v3.0.9
Browserslist: caniuse-lite is outdated. Please run:
npx browserslist@latest --update-db
Taro CLI 3.0.9 environment info:
System:
OS: macOS 10.15.3
Shell: 5.7.1 - /bin/zsh
Binaries:
Node: 10.18.0 - ~/.nvm/versions/node/v10.18.0/bin/node
Yarn: 1.22.4 - ~/.nvm/versions/node/v10.18.0/bin/yarn
npm: 6.13.4 - ~/.nvm/versions/node/v10.18.0/bin/npm
npmPackages:
@tarojs/components: 3.0.9 => 3.0.9
@tarojs/mini-runner: 3.0.9 => 3.0.9
@tarojs/react: 3.0.9 => 3.0.9
@tarojs/runtime: 3.0.9 => 3.0.9
@tarojs/taro: 3.0.9 => 3.0.9
@tarojs/webpack-runner: 3.0.9 => 3.0.9
babel-preset-taro: 3.0.9 => 3.0.9
eslint-config-taro: 3.0.9 => 3.0.9
react: ^16.10.0 => 16.13.1
taro-ui: ^3.0.0-alpha.3 => 3.0.0-alpha.3
### 补充信息
1. 复现机型是iphoneX ios12.4.1 微信最新版本
2. 小程序原生提供的解决方法应该是catchtouchmove事件,但是我跑demo的时候编译后发现class="at-float-layout"这个元素上没有创建catchtouchmove
3. h5的解决方案里是给body加上"at-frozen"类,在仓库里这个类写在app.scss里,而没有编译进包里,所以开发者需要自己补充这个类才能正常解决h5下的穿透问题
Contributor guide
Assessment
This issue has not been assessed yet.