【报Bug】地图组件上方的cover-view在真机上不显示

示例代码：

<template> <view class="map-container"> <map id="myMap" :style="'width: ' + mapWidth + '; height: ' + mapHeight + ';'" :longitude="longitude"

latitude="latitude" :markers="markers" class="map"> <cover-view class="card">
<cover-view class="card-header">
<cover-view class="header-left">
<cover-view class="border-left"></cover-view>
<cover-view class="title">基本信息</cover-view>
</cover-view>
<cover-view class="status" :style="formattedFlowStyle(workDetailData.woStateName)">
{{ workDetailData.woStateName }}
</cover-view>
</cover-view>

        <cover-view class="card-content">  
            <cover-view class="info-row">  
                <cover-view class="label">工单号：</cover-view>  
                <cover-view class="value">{{ workDetailData.woCode || '-' }}</cover-view>  
            </cover-view>  

            <cover-view class="info-row">  
                <cover-view class="label">场站：</cover-view>  
                <cover-view class="value">{{ workDetailData.projectName || '-' }}</cover-view>  
            </cover-view>  

            <cover-view class="info-row" v-if="workDetailData.formName">  
                <cover-view class="label">表单：</cover-view>  
                <cover-view class="value">{{ workDetailData.formName || '-' }}</cover-view>  
            </cover-view>  

            <cover-view class="info-row" v-if=" workDetailData.typeName">  
                <cover-view class="label">当前流程：</cover-view>  
                <cover-view class="value">  
                    <cover-view :style="formattedFlowStyle(workDetailData.typeName)">  
                        {{ workDetailData.typeName }}  
                    </cover-view>  
                </cover-view>  
            </cover-view>  

            <cover-view class="info-row" v-if="workDetailData.applicant">  
                <cover-view class="label">下单人：</cover-view>  
                <cover-view class="value">{{ workDetailData.applicant || '-' }}</cover-view>  
            </cover-view>  
        </cover-view>  
    </cover-view>  
</map>  

<!-- 使用cover-view确保在APP地图上方显示 -->  

</view>
</template>

<script>
import {
apiDetailsWork
} from '@/apis/work.js'
export default {
data() {
return {
longitude: 116.39742,
latitude: 39.909,
mapHeight: '100%',
mapWidth: '100%',
workDetailData: {
woCode: '',
projectName: '',
formName: '',
woStateName: '',
typeName: '',
applicant: ''
},
markers: [{
id: 1,
longitude: "",
latitude: "",
iconPath: '/static/marker.png',
width: 30,
height: 30
}]
}
},
mounted() {
this.queryLocation()
this.getWorkDetail()
this.createMap();
},
methods: {
createMap() {
uni.showLoading({
title: '加载中'
})

            this.mapCtx = uni.createMapContext('myMap', this);  
            uni.getSystemInfo({  
                success: res => {  
                    // 确保地图填满屏幕  
                    this.mapHeight = res.windowHeight + 'px';  
                    this.mapWidth = res.windowWidth + 'px';  
                    uni.hideLoading()  
                },  
                fail: () => {  
                    // 备用尺寸  
                    this.mapHeight = '100vh';  
                    this.mapWidth = '100vw';  
                    uni.hideLoading()  
                }  
            });  
        },  
        async getWorkDetail() {  
            try {  
                const {  
                    data  
                } = await apiDetailsWork(this.$store.state.workId)  
                this.workDetailData = {  
                    woCode: data.workOrderDTO?.woCode || '',  
                    projectName: data.workOrderDTO?.projectName || '',  
                    formName: data.workOrderDTO?.formName || '',  
                    woStateName: data.workOrderDTO?.woStateName || '',  
                    typeName: data.workOrderDTO?.typeName || "",  
                    applicant: data.workOrderDTO?.applicant || '',  
                }  
            } catch (error) {  
                console.error("获取工单详情失败:", error);  
                uni.showToast({  
                    title: '加载数据失败',  
                    icon: 'none'  
                });  
            }  
        },  
        formattedFlowStyle(status) {  
            let style = {  
                padding: '4rpx 16rpx',  
                borderRadius: '8rpx',  
                fontSize: '24rpx',  
                fontWeight: 'bold',  
                display: 'inline-block'  
            };  

            switch (status) {  
                case '已完成':  
                case '已申请':  
                case '已指派/接单':  
                case '已执行':  
                case '已结单':  
                    style.backgroundColor = "#EAFFEA";  
                    style.color = "#009900";  
                    break;  
                case '已取消':  
                case '已作废':  
                    style.backgroundColor = "#ECECEC";  
                    style.color = "#989E9B";  
                    break;  
                case '退回':  
                case '驳回':  
                case '已退回':  
                case '已驳回':  
                    style.backgroundColor = "#FFEDF2";  
                    style.color = "#F34D61";  
                    break;  
                case '待接单':  
                    style.backgroundColor = "#FFF6F1";  
                    style.color = "#FF7D41";  
                    break;  
                case '待审批':  
                case '待审批人':  
                    style.backgroundColor = "#EEF6FF";  
                    style.color = "#1A97F0";  
                    break;  
                default:  
                    style.backgroundColor = "#EAFFEA";  
                    style.color = "#2ABF57";  
            }  
            return style;  
        },  
        queryLocation() {  
            let type = '';  
            switch (uni.getSystemInfoSync().platform) {  
                case 'android':  
                    type = 'gcj02';  
                    break;  
                case 'ios':  
                    type = 'wgs84';  
                    break;  
            }  

            uni.getLocation({  
                type,  
                geocode: true,  
                success: (res) => {  
                    this.longitude = res.longitude;  
                    this.latitude = res.latitude;  

                    if (this.markers.length > 0) {  
                        this.markers[0].longitude = res.longitude;  
                        this.markers[0].latitude = res.latitude;  
                    }  
                },  
                fail: (err) => {  
                    console.log("定位失败:", err);  
                    uni.showToast({  
                        title: '获取位置失败',  
                        icon: 'none'  
                    });  
                }  
            });  
        },  
    }  
}  

</script>

<style scoped>
.map-container {
position: relative;
width: 100%;
height: 100vh;
overflow: hidden;
}

.map {  
    position: absolute;  
    top: 0;  
    left: 0;  
    right: 0;  
    bottom: 0;  
}  

.card {  
    position: absolute;  
    top: 20rpx;  
    left: 20rpx;  
    right: 20rpx;  
    background-color: #fff;  
    border-radius: 16rpx;  
    padding: 24rpx;  
    box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.1);  
    /* 确保在地图上方 */  
}  

.card-header {  
    display: flex;  
    justify-content: space-between;  
    align-items: center;  
    margin-bottom: 30rpx;  
}  

.header-left {  
    display: flex;  
    align-items: center;  
}  

.border-left {  
    width: 8rpx;  
    height: 32rpx;  
    background-color: #2ABF57;  
    border-radius: 4rpx;  
    margin-right: 16rpx;  
}  

.title {  
    font-size: 32rpx;  
    font-weight: bold;  
    color: #383838;  
}  

.status {  
    padding: 4rpx 16rpx;  
    border-radius: 8rpx;  
    font-size: 24rpx;  
    font-weight: bold;  
}  

.card-content {  
    width: 100%;  
}  

.info-row {  
    display: flex;  
    margin-bottom: 24rpx;  
    font-size: 28rpx;  
    line-height: 1.6;  
}  

.label {  
    color: #666;  
    width: 160rpx;  
    flex-shrink: 0;  
}  

.value {  
    color: #383838;  
    flex: 1;  
}  

</style>

操作步骤：

页面无论使用nvue，或者使用vue文件类型，都无法显示出来，如果cover-view内容不嵌套可以有内容，比如<cover-view class="card">测试是否显示</cover-view>我这个页面是作为子组件形式使用。

预期结果：

cover-view里面的文字内容显示出来

实际结果：

cover-view里面的内容无法显示