SmileLiber
SmileLiber
  • 发布:2021-03-04 14:01
  • 更新:2022-04-20 12:28
  • 阅读:1215

【报Bug】钉钉小程序cover-view标签无效

分类:uni-app

产品分类: uniapp/小程序/阿里

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: Microsoft Windows [版本 10.0.19042.746]

HBuilderX类型: 正式

HBuilderX版本号: 3.1.2

第三方开发者工具版本号: 1.17.9

基础库版本号: 1.24.8

项目创建方式: HBuilderX

示例代码:
<template>  
    <view>  
        <page-head title="cover-view用于覆盖map、video等原生组件"></page-head>  
        <view class="cover-content" v-if="showMap">  
            <!-- TODO暂时条件编译解决支付宝小程序不能正常显示 cover-x -->  
            <!-- #ifdef APP-PLUS -->  
            <map>  
                <cover-view class="cover-view">简单的cover-view.vue</cover-view>  
                <cover-image class="cover-image" src="/static/uni.png"></cover-image>  
            </map>  
            <!-- #endif -->  

            <!-- #ifndef APP-PLUS -->  
            <!-- #ifndef MP-QQ -->  
            <map></map>  
            <!-- #endif -->  

            <!-- TODO QQ暂不支持地图组件 -->  
            <!-- #ifdef MP-QQ -->  
            <video class="video" src="https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/%E7%AC%AC1%E8%AE%B2%EF%BC%88uni-app%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D%EF%BC%89-%20DCloud%E5%AE%98%E6%96%B9%E8%A7%86%E9%A2%91%E6%95%99%E7%A8%8B@20181126-lite.m4v"></video>  
            <!-- #endif -->  

            <cover-view class="cover-view">简单的cover-view</cover-view>  
            <!-- #ifndef MP-QQ -->  
            <cover-image class="cover-image" src="/static/uni.png"></cover-image>  
            <!-- #endif -->  
            <!-- #endif -->  
        </view>  
    </view>  
</template>  

<script>  
    export default {  
        data() {  
            return {  
                showMap: false  
            };  
        },  
        onLoad() {  
      // #ifdef APP-PLUS || MP-BAIDU  
            setTimeout(()=>{  
                this.showMap = true  
            },350)  
      // #endif  
      // #ifndef APP-PLUS || MP-BAIDU  
            this.showMap = true  
      // #endif  
        }  
    }  
</script>  

<style>  
    map {  
        width: 750rpx;  
        width: 100%;  
        height: 600px;  
    }  

    .video {  
        width: 100%;  
    }  

    .cover-content {  
        position: relative;  
    }  

    .cover-view {  
        position: absolute;  
        left: 5px;  
        top: 5px;  
        width: 375rpx;  
        text-align: center;  
        background-color: #DDDDDD;  
    }  

    .cover-image {  
        position: absolute;  
        left: 0;  
        top: 0;  
        right: 0;  
        bottom: 0;  
        margin: auto;  
        width: 96px;  
        height: 96px;  
    }  
</style>  

操作步骤:

Hello uni-app 直接运行到小程序模拟器(支付宝小程序开发者)
选择 钉钉 》 企业内部应用

预期结果:

<cover-view class="cover-view">简单的cover-view</cover-view>
显示在地图组件上面

实际结果:

模拟器:
<cover-view>元素不存在,请检查你的代码
真机调试:
“简单的cover-view”出现在最底部

bug描述:

使用Hello uni-app演示框架中的【内置组件】》【视图容器】》【cover-view】

2021-03-04 14:01 负责人:无 分享
已邀请:
DCloud_UNI_Anne

DCloud_UNI_Anne

应该是支付宝小程序模拟器的bug,建议以真机为主。

  • SmileLiber (作者)

    第二第三张截图是真机测试,还请验证,谢谢

    2021-03-06 08:12

SmileLiber

SmileLiber (作者)

? 是否是BUG? 还请帮忙确认下,还等着项目发布呢/(ㄒoㄒ)/~~

孟凡华

孟凡华

同样遇到cover-view和cover-image在钉钉小程序中失效

该问题目前已经被锁定, 无法添加新回复