- 发布:2021-09-29 11:43
- 更新:2024-09-24 10:40
- 阅读:2043
【报Bug】scroll-view内部子组件包含的uni-popup、uni-drawer等子组件,会被scroll-view区域包裹,仅能在scroll-view区域内显示
产品分类: uniapp/App
PC开发环境操作系统: Windows
PC开发环境操作系统版本号: win10
HBuilderX类型: 正式
HBuilderX版本号: 3.2.9
手机系统: 全部
手机厂商: 华为
页面类型: vue
打包方式: 云端
项目创建方式: HBuilderX
测试过的手机:
示例代码:
<template>
<view class="container">
<view class="panel-item">
</view>
<view class="panel-item">
<scroll-view scroll-y="true" style="height: 100%;">
<view class="scroll-body">
<text>scroll-view区域</text>
<uni-popup ref="pop-body">
<view class="pop-body">uni-pop</view>
</uni-popup>
</view>
</scroll-view>
</view>
</view>
</template>
<script>
export default {
mounted() {
this.$refs['pop-body'].open()
}
}
</script>
<style lang="scss">
.container {
width: 100vw;
height: 100vh;
background-color: skyblue;
display: flex;
.panel-item {
width: 40%;
margin: 0 10%;
height: 100%;
background-color: #1AAD19;
.scroll-body {
width: 100%;
height: 100%;
background-color: #BE926E;
}
}
}
.pop-body {
width: 100px;
height: 100px;
background-color: #36FF00;
}
</style>
<template>
<view class="container">
<view class="panel-item">
</view>
<view class="panel-item">
<scroll-view scroll-y="true" style="height: 100%;">
<view class="scroll-body">
<text>scroll-view区域</text>
<uni-popup ref="pop-body">
<view class="pop-body">uni-pop</view>
</uni-popup>
</view>
</scroll-view>
</view>
</view>
</template>
<script>
export default {
mounted() {
this.$refs['pop-body'].open()
}
}
</script>
<style lang="scss">
.container {
width: 100vw;
height: 100vh;
background-color: skyblue;
display: flex;
.panel-item {
width: 40%;
margin: 0 10%;
height: 100%;
background-color: #1AAD19;
.scroll-body {
width: 100%;
height: 100%;
background-color: #BE926E;
}
}
}
.pop-body {
width: 100px;
height: 100px;
background-color: #36FF00;
}
</style>
操作步骤:
scroll-view组件内部写个uni-popup、uni-drawer子组件
scroll-view组件内部写个uni-popup、uni-drawer子组件
预期结果:
popup能在页面中居中显示
popup能在页面中居中显示
实际结果:
目前仅能在scroll-view区域居中显示
目前仅能在scroll-view区域居中显示
在<scroll-view>
< uni-swipe-action-item>
<warehouseCell></warehouseCell>在这里面调用popup
</ uni-swipe-action-item>
</scroll-view>
这种又拉胯了,嘿嘿
dez (作者)
实际上 并非直接将uni-popup等直接放scroll-view中,是scroll-view中需要用到一些公共的组件,比如会员信息等组件,然后信息组件可能需要查看详情等操作,需要用到uni-popup。这个uni-popup是放到会员登录信息组件里去实现,作为会员信息组件的一部分。不好提取到第一个根节点
2021-09-29 13:35
赵日天11111
什么时候修复了,这么多年不都这样吗,,,2023年都快结束了,这个问题依旧是存在的,,苹果手机微信小程序上面就有
2023-12-13 09:29
困难总比办法多
1008611
2024-03-28 17:44
4***@qq.com
那倒是修复啊,亲
2024-09-06 15:54
4***@qq.com
回复 dez: 你好,请问您这个最后怎么解决的呢?
2024-09-09 18:13
2***@qq.com
这个问题值得被修复,ios 上的 app 上有严重的问题,uni-popup 无法遮挡 scroll-view 里面的内容,~-~
2024-11-01 21:30