1.1.简介

忙里偷闲，学点Java知识。越发觉得世界语言千千万，最核心的还是思想，一味死记硬背只会让人觉得很死板不灵活，嗯~要灵活~

1.2.问题

permission.js:37 [Vue warn]: Error in render: "TypeError: Cannot read properties of null (reading 'length')"

found in

---> <ElTableBody>
       <ElTable> at packages/table/src/table.vue
         <List> at src/views/system/sysMenu/list.vue
           <AppMain> at src/layout/components/AppMain.vue
             <Layout> at src/layout/index.vue
               <App> at src/App.vue
                 <Root>

1.3.解决

找到这行代码

          <el-button type="danger" icon="el-icon-delete" size="mini" @click="removeDataById(scope.row.id)" title="删除" :disabled="scope.row.children.length > 0"/>

将这行代码修改为

          <el-button type="danger" icon="el-icon-delete" size="mini" @click="removeDataById(scope.row.id)" title="删除"   :disabled="scope.row.children != null && scope.row.children.length > 0"/>

以下是解决问题的思路，着急的小伙伴可以不用看 以上三步就满足需求的~

1.4.定位

点击错误日志，跳转到对应的代码行，页面提示这行代码有问题，

可是为什么这个地方有问题呢，接口文档测试下来是能获取到数据的，有重新检查了下API文件，然后就找到查询列表方法这里有一个console日志输出的

观察数据

继续看子节点数据

最底层的数据发现了问，发现children的值为null。结合前面的代码既然判断了长度那么null可能是特殊情况没有判断到，再加一个条件就好了

1.5.测试