【报Bug】H5页面第一次加载会出现部分空白，偶尔出现,可能是什么原因？

【报Bug】H5页面第一次加载会出现部分空白，偶尔出现,可能是什么原因？
页面代码如下：

<template>  
    <view class="bd">  
        <!-- 顶部用户信息 -->  
        <view class="user-info box-s">  
            <image class="head-img" v-if="userInfo && userInfo.head"  
                @tap="menuTap('/pages/personal/user-info/user-info')" :src="userInfo.head + imgScale" mode="aspectFill">  
            </image>  
            <view class="info-v box-s" @tap="menuTap('/pages/personal/user-info/user-info')">  
                <view class="name-v ycyc1">{{userInfo.nickname}}</view>  
                <view class="phone-v">  
                    {{login ? (userInfo.telephone.substring(0, 3) + '******' + userInfo.telephone.substr(9) ):"登录后可查看你的数字藏品"}}  
                </view>  
            </view>  
            <view class="index-btn" v-if="login" @tap="toindex">个人主页</view>  
        </view>  
        <block v-if="login && userInfo.chain">  
            <view class="xxian"></view>  
            <view class="block-address">  
                <text class="ycyc1">区块链地址：{{userInfo.chain}}</text>  
                <image @tap="copyTap" src="../../static/personal/copy.png" mode="widthFix"></image>  
            </view>  
        </block>  

        <view class="menu-v box-s">  
            <view class="menu-item" @tap="menuTap('/pages/order/list')">  
                <image src="../../static/personal/dd.png" mode="widthFix"></image>  
                <text>我的订单</text>  
            </view>  
            <view class="menu-item" @tap="menuTap('/pages/collection/list')">  
                <image src="../../static/personal/jl.png" mode="widthFix"></image>  
                <text>藏品记录</text>  
            </view>  
            <view class="menu-item" @tap="menuTap('/pages/personal/message/list')">  
                <image src="../../static/personal/xx.png" mode="widthFix"></image>  
                <text>消息</text>  
                <view class="red-v"  
                    v-if="userInfo.sysMsg>0||userInfo.likeMsg>0||userInfo.replyMsg>0||userInfo.followMsg>0"></view>  
            </view>  
            <view class="menu-item" @tap="menuTap('/pages/personal/set/set')">  
                <image src="../../static/personal/sz.png" mode="widthFix"></image>  
                <text>设置</text>  
            </view>  
        </view>  

        <view class="module-v box-s" @tap="menuTap('/pages/personal/query/query')">  
            <image class="icon-v" src="../../static/personal/fdj.png" mode="widthFix"></image>  
            <text>区块链信息查询</text>  
            <image class="jt-v" src="../../static/personal/bjt.png" mode="widthFix"></image>  
        </view>  

        <view class="module-v box-s" @tap="menuTap('/pages/personal/safety/safety')">  
            <image class="icon-v" src="../../static/personal/wd.png" mode="widthFix"></image>  
            <text>账号与安全</text>  
            <image class="jt-v" src="../../static/personal/bjt.png" mode="widthFix"></image>  
        </view>  
        <!-- #ifdef H5 -->  
        <block v-if="userInfo && userInfo.nickname && !userInfo.isBind">  
            <view class="module-v box-s" @tap="menuTap('bindwx')">  
                <image class="icon-v" src="../../static/personal/bd.png" mode="widthFix"></image>  
                <text>绑定微信</text>  
                <image class="jt-v" src="../../static/personal/bjt.png" mode="widthFix"></image>  
            </view>  
        </block>  
        <!-- #endif -->  

        <view class="module-v box-s" @tap="menuTap('/pagesTwo/kf/kf')">  
            <image class="icon-v" src="../../static/personal/kf.png" mode="widthFix"></image>  
            <text>我的客服</text>  
            <image class="jt-v" src="../../static/personal/bjt.png" mode="widthFix"></image>  
        </view>  

        <view class="module-v box-s" @tap="menuTap('/pagesTwo/about/about')">  
            <image class="icon-v" src="../../static/personal/gy.png" mode="widthFix"></image>  
            <text>关于云启</text>  
            <image class="jt-v" src="../../static/personal/bjt.png" mode="widthFix"></image>  
        </view>  

        <!-- #ifdef H5 -->  
        <view class="module-v box-s" @tap="menuTap('share')">  
            <image class="icon-v" src="../../static/personal/fs.png" mode="widthFix"></image>  
            <text>分享云启</text>  
            <image class="jt-v" src="../../static/personal/bjt.png" mode="widthFix"></image>  
        </view>  
        <view style="margin-bottom: 100px;"></view>  
        <!-- #endif -->  
        <!-- #ifndef H5 -->  
        <button class="module-v box-s clear-btn" open-type="share">  
            <image class="icon-v" src="../../static/personal/fs.png" mode="widthFix"></image>  
            <text>分享云启</text>  
            <image class="jt-v" src="../../static/personal/bjt.png" mode="widthFix"></image>  
        </button>  
        <!-- #endif -->  

        <mycopy ref="mycopy"></mycopy>  
        <!-- <poster ref="poster" page="personal"></poster> -->  
        <!-- #ifdef H5 -->  
        <!-- 分享提示 -->  
        <wxsharets ref="wxsharets"></wxsharets>  
        <!-- 自定义菜单栏 -->  
        <customtabBar pageCode='personal'></customtabBar>  
        <!-- #endif -->  
    </view>  
</template>  

<script>  

</script>  

<style lang="scss" scoped>  
    .user-info {  
        width: calc(100% - (30rpx * 2));  
        padding-top: 44rpx;  
        margin: 0 30rpx 44rpx;  
        display: flex;  
        align-items: center;  
        justify-content: space-between;  
        // flex-wrap: wrap;  

        .head-img {  
            width: 100rpx;  
            height: 100rpx;  
            border-radius: 100rpx;  
            flex-shrink: 0;  
        }  

        .info-v {  
            color: #fff;  
            flex-grow: 1;  
            padding: 0 20rpx;  

            .name-v {  
                font-size: 38rpx;  
            }  

            .phone-v {  
                font-size: 24rpx;  
                margin-top: 10rpx;  
                color: #898989;  
            }  
        }  

        .index-btn {  
            background-color: #3B3C3E;  
            color: #fff;  
            font-size: 30rpx;  
            text-align: center;  
            line-height: 60rpx;  
            padding: 0 20rpx;  
            border-radius: 60rpx;  
            flex-shrink: 0;  
        }  
    }  

    .xxian {  
        width: calc(100% - (30rpx * 2));  
        margin: 0 30rpx 0;  
    }  

    .block-address {  
        width: calc(100% - (36rpx * 2));  
        height: 40rpx;  
        margin: 0 36rpx;  
        color: #898989;  
        display: flex;  
        align-items: center;  
        justify-content: space-between;  
        padding: 30rpx 0;  
        font-size: 24rpx;  

        text {  
            width: calc(100% - 44rpx - 20rpx);  
        }  

        image {  
            width: 44rpx;  
            height: 44rpx;  
        }  
    }  

    .menu-v {  
        display: flex;  
        background-color: #2D2F2E;  
        width: calc(100% - (30rpx * 2));  
        margin: 0 30rpx 20rpx;  
        border-radius: 20rpx;  
        padding: 0 10rpx;  

        .menu-item {  
            width: calc(100% / 4);  
            display: flex;  
            justify-content: center;  
            flex-wrap: wrap;  
            text-align: center;  
            margin: 40rpx 0 30rpx;  
            position: relative;  

            .red-v {  
                position: absolute;  
                background-color: #EC4976;  
                width: 20rpx;  
                height: 20rpx;  
                border-radius: 20rpx;  
                right: 25%;  
                top: -4rpx;  
            }  

            image {  
                width: 55rpx;  
                height: 55rpx;  
                margin-bottom: 20rpx;  
            }  

            text {  
                width: 100%;  
                color: #898989;  
                font-size: 22rpx;  
            }  
        }  
    }  

    .module-v {  
        height: 120rpx;  
        width: calc(100% - (30rpx * 2));  
        background-color: #2D2F2E;  
        margin: 0 30rpx 20rpx;  
        border-radius: 20rpx;  
        padding: 0 30rpx;  
        display: flex;  
        justify-content: space-between;  
        align-items: center;  
        font-size: 30rpx;  

        .icon-v {  
            width: 44rpx;  
            height: 44rpx;  
            float: left;  
        }  

        text {  
            color: #fff;  
            flex-grow: 1;  
            padding-left: 30rpx;  
            text-align: left;  
        }  

        .jt-v {  
            width: 30rpx;  
            height: 30rpx;  
        }  

    }  

    .clear-btn {  
        -webkit-tap-highlight-color: unset !important;  
        color: unset !important;  
        cursor: unset !important;  
        line-height: unset !important;  
        overflow: unset !important;  
        position: unset !important;  
        text-decoration: unset !important;  
    }  

    .clear-btn::after {  
        display: none;  
    }  
</style>