wppeng
wppeng
  • 发布:2020-01-16 09:57
  • 更新:2020-01-16 12:06
  • 阅读:127

【报Bug】ios设置横屏后,第二次在加载样式会出问题

分类:uni-app

详细问题描述

第一次调转到横屏页面,样式正常,返回在重新打开当前横屏页面,设置的图标变大了,跟着有些其他页面样式也对应变大了,详见附件那个返回按钮。安卓手机没有问题

页面代码

<!--  -->  
<template>  
    <view class='star' :style="{width:width ,height: height}">  
        <text class="my-icon back" @tap="tapBack">&#xe7ec;</text>  
        <image @tap="tapImage" :style="{width:width ,height: height}" src="/static/test/timg.gif" mode="scaleToFill" ></image>  
    </view>  
</template>  

<script>  
    export default {  
        data() {  
            return {  
                width:'667px',  
                height:'375px'  
            }  
        },  
        onLoad() {  
            let that = this;  
            let systemInfo=this.$store.state.systemInfo;  
            console.log(systemInfo);  

            // #ifdef APP-PLUS  
            plus.screen.lockOrientation("landscape-primary");  
            // #endif  
        },  
        onUnload() {  
            console.log('监听页面卸载')  
            // #ifdef APP-PLUS  
            plus.screen.unlockOrientation();  
            plus.screen.lockOrientation("portrait-primary");  
            // #endif  
        },  
        /**  
        * 计算属性  
        */  
        computed: {  

        },  
        methods: {  
            /**  
             * 返回  
             */  
            tapBack() {  
                console.log('返回')  
                //uni.navigateBack()  
            },  
            tapImage(){  
                console.log('图片')  

            }  
        }  
    }  
</script>  

<style lang="scss" scoped>  
    .star{  
        overflow: hidden;  
    }  
    .back {  
        position: absolute;  
        display: flex;  
        justify-content: center;  
        align-items: center;  
        width: 58upx;  
        height: 58upx;  
        border-radius: 20upx;  
        background: #eee;  
        z-index: 10;  
        color: #ababab;  
        left: 20upx;  
        top: 10upx;  
        font-size: 32upx;  
    }  
</style>
2020-01-16 09:57 分享
已邀请:
wppeng

wppeng (作者)

怀疑是使用了横屏的宽度渲染页面。导致内容放大。安卓上未发现该问题,ios出现

DCloud_iOS_XHY

DCloud_iOS_XHY

上传一个完整的测试工程吧

  • 梓蜀微术

    https://ask.dcloud.net.cn/question/88965

    麻烦看一下上方链接这个问题,应该是和本问题一致的 上传了实例代码,希望能更好的帮助开发者定位问题,或者我所使用的方式有什么不对的 麻烦指正一下 蟹蟹

    2020-02-16 16:22

要回复问题请先登录注册