jdf2e / nutui-react

京东风格的移动端 React 组件库 、支持多端小程序(A React UI Toolkit for Mobile Web)
https://nutui.jd.com/react/
853 stars 252 forks source link

Popup组件不能覆盖 Tabbar(fixed) 组件 #2174

Open jiankian opened 4 months ago

jiankian commented 4 months ago

NutUI React 包名

@nutui/nutui-react

NutUI React 版本号

2.6.0

平台

weapp

重现链接

https://gitee.com/jiankian/AnnTaroNutUI-Test/blob/master/src/pages/index/index.tsx

重现步骤

NutUI的Popup展示时,无法覆盖Tabbar,zIndex也设置不了

期望的结果是什么?

Popup内容能覆盖住Tabbar

实际的结果是什么?

Tabbar一直在Popup之上

环境信息

No response

其他补充信息

代码结构把Popup写在Tabbar之后可以 但是zIndex方式无效

xiaoyatong commented 4 months ago

这个场景可以截个图看一下。为什么要盖住 tabbar

arlequinfei commented 4 months ago

我也是同样的问题,不过我使用的是vue

image

dyxxxyd commented 3 months ago
image image

还有这个问题,微信开发工具预览会往右偏移了4

xiaoyatong commented 3 months ago

image image 还有这个问题,微信开发工具预览会往右偏移了4

这个问题已提pr

xiaoyatong commented 3 months ago

image

  <>
    <Tabbar
      onSwitch={(value) => {
        console.log(value)
      }}
    >
      <Tabbar.Item title="首页" icon={<Home size={18} />} value={9} />
      <Tabbar.Item title="分类" icon={<Category size={18} />} />
      <Tabbar.Item title="发现" icon={<Find size={18} />} />
      <Tabbar.Item title="购物车" icon={<Cart size={18} />} />
      <Tabbar.Item title="我的" icon={<User size={18} />} />
    </Tabbar>
    <Popup zIndex={2000} visible={true} style={{ padding: '30px 50px' }} />
  </>