8***@qq.com
8***@qq.com
  • 发布:2019-10-10 18:40
  • 更新:2019-11-03 19:58
  • 阅读:4217

uniapp app切换页面的时候,会白屏1-2s才会显示网页内容

分类:uni-app

uniapp 方式开发的app
1、页面切换经常会白屏1一会(1-2s),才会显示网页内容
2、安卓中css动画会和卡,ios不会

网页代码详见附件

<template>  
    <view class="content">  
        <view class="nav">  
            <text :class="{'active':active===0}" @tap="clkNav(0)">常见问题</text>  
            <text :class="{'active':active===1}" @tap="clkNav(1)">意见反馈</text>  
        </view>  
        <swiper class="swiper" :current="active" @change="spchange">  
            <swiper-item>  
                <image class="no-record center-hv" src="../../../static/invite/otc_kby.png" mode="aspectFit" v-if="allList===null"></image>  
                <scroll-view class="wrap-list" :scroll-y="true" @scrolltolower="scrolltolowerAll" v-else>  
                    <uni-list>  
                        <uni-list-item v-for="(item,index) in allList" :key="item.id" :title="item.title" :note="item.cont" :showArrow="false" />  
                    </uni-list>  
                    <uni-load-more :status="more"></uni-load-more>  
                </scroll-view>  
            </swiper-item>  
            <swiper-item>  
                <image class="no-record center-hv" src="../../../static/invite/otc_kby.png" mode="aspectFit" v-if="historyList===null"></image>  
                <scroll-view class="wrap-list" :scroll-y="true" @scrolltolower="scrolltolowerHistory" v-else>  
                    <uni-list>  
                        <uni-list-item v-for="(item,index) in historyList" :key="item.id" :title="item.question" @tap="clkItem(item)" />  
                    </uni-list>  
                    <uni-load-more :status="more2"></uni-load-more>  
                </scroll-view>  
            </swiper-item>  
        </swiper>  

    </view>  
</template>  

<script>  
    import uniList from '@/components/uni-list/uni-list.vue'  
    import uniListItem from '@/components/uni-list-item/uni-list-item.vue'  
    import uniLoadMore from "@/components/uni-load-more/uni-load-more.vue"  
    import { getGetFeedbackList, getGetHelpList, getGetWtList } from '@/service.js';  

    export default {  
        components: {  
            uniList, uniListItem, uniLoadMore  
        },  
        data() {  
            return {}  
        },  
        onNavigationBarButtonTap () {  
            uni.navigateTo({  
                url: '/pages/my/help/new'  
            })  
        },  
        onLoad () {  
            setTimeout(() => {  
                this.clkNav(0);  
            }, 500)  
            uni.$on('freshFeedList', () => {  
                this.page = 1;  
                this.clkNav(1);  
            })  
        }  
    }  
</script>  

2019-10-10 18:40 负责人:无 分享
已邀请:

最佳回复

DCloud_heavensoft

DCloud_heavensoft

  • Yuhuawang

    IOS也是这情况,而且至少白屏1-2秒,这个好像不是背景引起的吧

    2019-11-20 17:03

  • DCloud_heavensoft

    回复 Yuhuawang: iOS没有背景操作ui的问题。检查其他原因吧

    2019-11-20 18:25

7***@qq.com

7***@qq.com

同问

丁涛

丁涛

请问解决了吗?

门里木

门里木

HBuilder X升到2.3后我的项目也有这个问题,新开一个页面有时需要几秒页面才渲染出来,特别明显的延迟,发生频率挺高的。开始安卓和ios都有这个情况,后面HBuilder X更新几次后,ios没有了这个问题,但我的安卓还是有。基本的调试发现正常渲染时,先走onReady再打印出请求的数据(onShow),不正常时先打印数据(onShow),几秒后再走onReady,这原因不知道如何下手查找,同一个页面有时正常有时不正常。HBuilder X退回到2.2.2编译安卓就没问题了,不会发生延迟渲染。所以这个项目编译安卓用2.2.2,ios用最新版。

  • DCloud_heavensoft

    提供示例代码和重现方式

    2019-10-22 22:16

  • 门里木

    回复 DCloud_heavensoft: 找到问题了,我是首页使用了uni-notice-bar组件并且设置公告滚动时,再打开其他页面时候就会出现延迟渲染的情况,注释掉滚动公告时就正常了,不会出现延迟渲染情况。

    2019-10-25 18:20

  • DCloud_uniCloud_WYQ

    回复 门里木: 发一份代码上来我试试

    2019-10-26 17:17

  • Nocker

    回复 门里木: 请问你是怎么解决这个问题的 直接不要这个组件了吗? 通过你发现的问题 发现了二级页面输入时卡顿的问题 https://ask.dcloud.net.cn/question/80480 是相同的问题 我把公告滚动代码注释掉 也解决了 但是这个组件都是必要的需求 该如何做 解决问题且不影响需求呢

    2019-10-28 16:39

  • Nocker

    我的项目也存在延迟渲染的问题 之前我没在意 以为是网络问题,我只是发现 tab页面进入的二级页面存在输入框 输入时就会很卡顿 一直找不到原因 之前的版本不存在这个问题

    2019-10-28 16:42

  • 门里木

    回复 Nocker: 滚动的公告设置不滚动了,静态就没问题。

    2019-10-28 23:47

门里木

门里木

打包安卓:首页点击demo打开页面没有延迟情况,导航1和导航2打开的demo页面有时就会有明显延迟的情况,导航1和导航2进入页面如果未出现延迟退出再进入,反复几次就会重现延迟渲染。

  • DCloud_uniCloud_WYQ

    确实有这个问题,一开始在github上有人反馈swiper会导致这个问题,就单独处理了swiper,现在看来应该是多数动画都会导致这个问题。感谢反馈

    2019-10-29 11:59

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