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.测试
