jd-opensource / jd-opensource/taro-ui
tabbar组件内部使用picker组件,picker组件无法正常显示
- Dominant language
- TypeScript
- Stars
- 4.7k
- Forks
- 740
- PR merge metrics
- No merged PRs in 30d
Description
### Taro UI 版本信息
2.3.2
### 问题描述
由于tabbar组件的class="at-tabs__body"元素,做滑动动效时配合使用transform: translate3d(-200%, 0px, 0px)和will-change: transform, left, top这两个属性,导致picker组件的class="weui-picker"和class="weui-mask"这两个元素无法正常展示出来,希望给picker增设一个appendToBody的属性将picker组件移到body层级下或者其他办法,以避免父级元素的个别样式对picker组件造成影响。
### 复现步骤
将picker组件放在tabbar组件下面,点击picker组件就会出现picker组件无法显示的情况
### 复现代码
触发picker弹窗
标签页二的内容
标签页三的内容
### 报错信息
没有报错信息,只是样式相冲突。
### 系统信息
Taro v2.1.1
Taro CLI 2.1.1 environment info:
System:
OS: Windows 10
Binaries:
Node: 12.13.0 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.4 - D:\Program Files\nodejs\node_global\yarn.CMD
npm: 6.12.0 - C:\Program Files\nodejs\npm.CMD
### 补充信息
由于tabbar组件的class="at-tabs__body"元素,做滑动动效时配合使用transform: translate3d(-200%, 0px, 0px)和will-change: transform, left, top这两个属性,导致picker组件的class="weui-picker"和class="weui-mask"这两个元素无法正常展示出来,希望给picker增设一个appendToBody的属性将picker组件移到body层级下或者其他办法,以避免父级元素的个别样式对picker组件造成影响。
Contributor guide
Assessment
This issue has not been assessed yet.