- 当前 Bug 的表现(可附上截图)
目前的业务需求是在live-pusher上添加一个可滚动区域文本区域,所以需要用到cover-view组件,文本的样式在开发者工具(最新版)上表现正常,但是在ios上和android上表现各有差异,都是有问题,具体见下图
开发者工具上的表现:
ios上:
android上:
- 预期表现
- 复现路径
- 提供一个最简复现 Demo
WXML:
<cover-view scroll-y="true" class="comment-wrap">
<cover-view class="comment" wx:for="{{commentArray}}">
<cover-view class="comment-name">{{item.userName}}:</cover-view>
{{item.comment}}
</cover-view>
</cover-view>
js:
commentArray: [
{
userName: 'inline-block',
comment: '我'
},
{
userName: '我是inline-block',
comment: '我超长我需要被换行,我不想被重叠,我需要被换行,我不想被重叠'
},
{
userName: '我是inline-block',
comment: '为什么我会被重叠呢'
},
],
WXSS:
.comment-wrap {
position: absolute;
bottom: 130rpx;
left: 30rpx;
max-width: 70%;
height: 40%;
overflow-y: scroll;
}
.comment {
float: left;
display: inline-block;
min-width: 51%;
max-width: 100%;
line-height: 40rpx;
padding: 12rpx 15rpx;
margin-bottom: 10rpx;
font-size: 32rpx;
color: #fff;
background-color: rgba(0,0,0,.3);
border-radius:10rpx;
white-space: normal;
}
.comment-name {
vertical-align: text-top;
display: inline-block;
color: #d9d9d9;
}
.comment:last-child {
margin-bottom: 0;
}
这块不支持这么写,文本需要用 cover-view 包裹住,也不支持文字环绕的效果。
也是醉了。。。lz解决了吗?
我也遇到这个问题,
border-top cover-view
直接无视,四个边都出来,不能单独自定义,工具是预期显示
请提供一下出现问题的机型和微信版本,以及能复现问题的简单代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)。
上面的问题描述已经提供了机型了版本了,就苹果手机和安卓手机都会出现,然后代码段已经在上面了
麻烦按照教程来提供下代码片段
https://developers.weixin.qq.com/s/Ve5iDTmx786s
请问你那边有重现么