功能描述:A页面展示列表a,点击a,进入B页面,展示a对象关联的子对象b。在B页面中,通过
unicloud-db组件manual模式加载,具体代码按照官网示例来写。
问题描述:代码实现后,一直在H5调试,显示正常。之后在微信小程序端,发现B页面第一次加载时,显示正常;在B页面返回A页面,再次点击a进入B页面时,页面显示空白(实际上不止是界面异常,由于部分对象为空,导致页面显示的时候,出现了个奇怪的is 错误,逐个排除后,发现这个问题无意义)。
问题推断:(1)最初以为是udb组件的问题,经过测试,发现数据返回正常
(2)之后推测是uni-list组件的问题,使用<p>标签,还是出现异常
(3)逐个调试,发现问题是:第一次加载页面时,先执行 onLoad事件,再执行页面渲染;第二次加载页面时,发现先执行了页面渲染,再执行onLoad事件。
问题解决:(1)上述问题(3),想办法更改事件执行顺序,或者想办法将页面B完全destroy,查了很多资料,尝试了很多办法,无果
(2)后来将页面写了一下,发现问题解决。两个页面的大体代码如下:
异常版:
<uni-card mode="basic">
<view>
<unicloud-db ref="udb2" v-slot:default="{data, loading, error, options}" collection="r-rbsh-task"
:where="sWhere" loadtime="manual">
<view v-if="error">{{error.message}}</view>
<view v-else>
<uni-list>
<uni-list-item v-if="data.length==0" title="暂未开始"></uni-list-item>
<uni-list-item v-else v-for="(item,index) in data" :title="test(item)"
wx:key="'r'+index.toString()" :key="'r'+index.toString()" link @click="showTskDeatail(item)" :note="item.state">
</uni-list-item>
</uni-list>
</view>
</unicloud-db>
</view>
</uni-card>
正常版:
<unicloud-db ref="udb2" v-slot:default="{data, loading, error, options}" collection="r-rbsh-task"
:where="sWhere" loadtime="manual">
<uni-card mode="basic">
<view v-if="error">{{error.message}}</view>
<view v-else>
<uni-list>
<uni-list-item v-if="data.length==0" title="暂未开始"></uni-list-item>
<uni-list-item v-else v-for="(item,index) in data" :title="test(item)"
wx:key="'r'+index.toString()" :key="'r'+index.toString()" link @click="showTskDeatail(item)" :note="item.state">
</uni-list-item>
</uni-list>
</view>
</uni-card>
</unicloud-db>
显示结果如上
两端代码差异:
异常段代码是将udb组件放入 uni-card块中,
正常段代码是将 uni-card组件放入udb块中
本帖子低质量极低,但是可以解决问题。
uniapp,希望坑可以少一些