uni-app 渲染错误：因业务需求，cell标签含2层for循环，list数据大于11时安卓鸿蒙系统必现渲染错误，数据为99时抛出java错误，ios正常

开发环境	版本号	项目创建方式
Windows	win10企业版	HBuilderX

产品分类：uniapp/App

PC开发环境操作系统：Windows

PC开发环境操作系统版本号：win10企业版

HBuilderX类型：正式

HBuilderX版本号：3.2.9

手机系统：Android

手机系统版本号：Android 12

手机厂商：华为

手机机型：mate40E

页面类型：vue

打包方式：云端

项目创建方式：HBuilderX

示例代码：


reportJSException >>> exception function:callAddElement, exception:arguments is empty, INSTANCE_RENDERING_ERROR will be set  
17:56:26.805 reportJSException >>> exception function:callAddElement, exception:arguments is empty, INSTANCE_RENDERING_ERROR will be set  
17:56:26.827 reportJSException >>> exception function:callAddElement, exception:arguments is empty, INSTANCE_RENDERING_ERROR will be set  
17:56:26.845 reportJSException >>> exception function:callLayout, exception:java.lang.NullPointerException: Attempt to invoke virtual method 'java.lang.String com.taobao.weex.ui.component.WXComponent.getComponentType()' on a null object reference  
17:56:26.866 at com.taobao.weex.bridge.WXBridgeManager.setExceedGPULimitComponentsInfo(WXBridgeManager.java:3087)  
17:56:26.886 at com.taobao.weex.bridge.WXBridgeManager.callLayout(WXBridgeManager.java:3302)  
17:56:26.907 at com.taobao.weex.bridge.WXBridge.callLayout(WXBridge.java:705)  
17:56:26.927 at com.taobao.weex.base.SystemMessageHandler.nativeRunWork(Native Method)  
17:56:26.947 at com.taobao.weex.base.SystemMessageHandler.handleMessage(SystemMessageHandler.java:104)  
17:56:26.968 at android.os.Handler.dispatchMessage(Handler.java:110)  
17:56:26.988 at android.os.Looper.loop(Looper.java:219)  
17:56:27.008 at android.os.HandlerThread.run(HandlerThread.java:67)  
17:56:27.029 reportJSException >>> exception function:callLayout, exception:java.lang.NullPointerException: Attempt to invoke virtual method 'java.lang.String com.taobao.weex.ui.component.WXComponent.getComponentType()' on a null object reference  
17:56:27.051 at com.taobao.weex.bridge.WXBridgeManager.setExceedGPULimitComponentsInfo(WXBridgeManager.java:3087)  
17:56:27.071 at com.taobao.weex.bridge.WXBridgeManager.callLayout(WXBridgeManager.java:3302)  
17:56:27.092 at com.taobao.weex.bridge.WXBridge.callLayout(WXBridge.java:705)  
17:56:27.113 at com.taobao.weex.base.SystemMessageHandler.nativeRunWork(Native Method)  
17:56:27.134 at com.taobao.weex.base.SystemMessageHandler.handleMessage(SystemMessageHandler.java:104)  
17:56:27.155 at android.os.Handler.dispatchMessage(Handler.java:110)  
17:56:27.176 at android.os.Looper.loop(Looper.java:219)  
17:56:27.196 at android.os.HandlerThread.run(HandlerThread.java:67)

操作步骤：渲染错误

预期结果：渲染正常

实际结果：渲染错误

bug描述： cell标签里面有2层for循环，当数据大于11必现渲染错误，当数据长度为99时直接抛出java错误

更多关于uni-app 渲染错误：因业务需求，cell标签含2层for循环，list数据大于11时安卓鸿蒙系统必现渲染错误，数据为99时抛出java错误，ios正常的实战教程也可以访问 https://www.itying.com/category-93-b0.html

nodeper 1楼

template 代码贴一下

更多关于uni-app 渲染错误：因业务需求，cell标签含2层for循环，list数据大于11时安卓鸿蒙系统必现渲染错误，数据为99时抛出java错误，ios正常的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html

gougou168 2楼

非常感谢回复，demo已补在下面了

gougou168 3楼

示例demo提供一下

zlyuanteng 4楼

demo已补在下方，麻烦看一下

yuanlaile 5楼

定义的roomStatelist还有业务在里面，目前已复现问题，故没有继续处理

htzhanglong 6楼作者

demo已补上，demo种注释代码恢复则不会出现exception function:callLayout, exception:java.lang.NullPointerException: Attempt to invoke virtual method ‘java.lang.String com.taobao.weex.ui.component.WXComponent.getComponentType()’ on a null object reference而是报错渲染问题exception function:callAddElement, exception:arguments is empty, INSTANCE_RENDERING_ERROR will be set

sinazl 7楼

<template> <view> <view> <text class="title">这是一个标题</text> </view> <scroller scroll-direction="horizontal" :bounce="false" class="data-container" :show-scrollbar="false" :style="{height: height - 25 +'px'}" > <list :show-scrollbar="false" :bounce="false" :style="{width: `${dateList.length*132}rpx`, height: height+'px'}">

<view class="row"> <view v-for="(item,index) in dateList" class="text-box-column" :key="'date'+index"> <text>{{item.dayOfWeek}}</text> <view class="date-mile"> <text class="font-size-12">{{item.remainRooms === 0 ? '满房' : `空${item.remainRooms}`}}</text> </view> </view> </view>

<cell v-for="(item, i) in roomTypelist" :key="index"> <view>{{item.name}}</view> <view v-for="($item, $index) in item.rooms" :key="$item+'room'" class="row"> <view v-for="(child,index) in roomStatelist[i][$index]" :key="child.selfId" class="text-box" :style="{ width: child.actualDurationDay?(child.actualDurationDay*132)+'rpx':child.durationDay ? (child.durationDay*132)+'rpx' : '132rpx', backgroundColor: '#FFFFFF' }"> <view :style="{width: child.actualDurationDay ? (child.actualDurationDay*132-4)+'rpx' : child.durationDay ? (child.durationDay*132-4)+'rpx' : '128rpx', top: '1rpx'}" class="room-detail-info"> </view> </view> </view> </cell> </list> </scroller> </view> </template> <script> import data from './data.js' export default { data() { return { dateList: data.dateList, roomTypelist: data.roomList, roomStatelist: [], height: 0 } }, onShow() { this.height = uni.getSystemInfoSync().windowHeight this.roomTypelist.forEach((v, i) => { if (v.rooms && v.rooms.length) { this.roomStatelist[i] = [] v.rooms.forEach((val, index) => { const temp = JSON.parse(JSON.stringify(this.dateList)) temp.forEach(k => { k = Object.assign(k, { $$checked: false, selfId: `${k.dayOfMonth}_${val.id}`, otaName: undefined, name: undefined, durationDay: undefined }) }) this.roomStatelist[i][index] = temp }) } }) }, methods: { } } </script> <style> .row{ flex-direction: row; } .data-container{ width: 750rpx; /* left: 0; top: 0; position: fixed; bottom: 0; */ background-color: #FFFFFF; } .text-box-column{ height: 128rpx; justify-content: center; flex-direction: column; align-items: center; border-right-width: 1rpx; border-bottom-width: 1rpx; border-top-width: 1rpx; border-color: #EEEEEE; width: 132rpx; color: #FFFFFF; background-color: #FFFFFF; } .text-box { height: 128rpx; justify-content: center; flex-direction: row; align-items: center; border-right-width: 1rpx; border-top-width: 1rpx; border-color: #EEEEEE; background-color: #FFFFFF; } .room-detail-info{ /* justify-content: center; align-items: center; */ height: 120rpx; } .room-detail-info-item{ align-items: flex-start; flex: 1; /* padding-top: 5rpx; */ padding-left: 10rpx; flex-direction: row; height: 40rpx; } .room-detail-item-night{ font-size: 24rpx; color: #2CC47F; height: 40rpx; line-height: 40rpx; } .room-detail-item-nomal{ font-size: 24rpx; line-height: 40rpx; } .room-detail-item-big{ font-size: 28rpx; text-overflow: ellipsis; lines: 1; line-height: 40rpx; } </style>