标签：undefined insertBefore read field 报错 scope null tableData row

报错出现场景

本人使用的是vue 3.x UI使用的是element-plus ,开发环境不会报错，打包后 报错

排查后发现都是el-table-column 组件 报错 导致虚拟dom 进行diff算法是报错

错误分析

<el-table-column prop="typeId" align="center" label="类型">
    <template #default="scope">
        <div>
            {{
            	remarkTypeList.filter(v => v.id == scope.row.typeId)[0]?.name   // 数据一开始，这里的下标[0]undefined 
            }}
        </div>
    </template>
</el-table-column>

 <el-table-column prop="attr" width="160" label="报关属性">
     <template #default="scope">  
         <el-select                   
             v-model="scope.row.attr[0].childrenChecked"    																	
             placeholder="请选择" >						
             .....

         </el-select>
     </template>
</el-table-column>
// 一开始 tableData是[]时, 导致 scope.row是{}，.attr就是undefined,后面的自然报错
// 没搞明白tableData是[]时, 为什么位运行scope.row.attr[0].childrenChecked，

 <el-table-column prop="list" label="字段信息">
     <template #default="scope">
         <span>{{ tempFilter(scope.row.field) }}</span>
     </template>
</el-table-column>

 const tempFilter = (field => {    
     let arr = field.split('|')  // 同上 一开始 tableData是[]时, 导致 scope.row.field是undefined，.split 报错
     ...
 }
     // 也没搞明白为什么一开始会走

希望对大家有所帮助

标签：undefined,insertBefore,read,field,报错,scope,null,tableData,row
来源： https://www.cnblogs.com/little-oil/p/15169202.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。