Vue报错:Error in render: “TypeError: Cannot read properties of undefined (reading ‘slice‘)“
出现问题:我的计算属性在这儿进行了slice的字符串切片,但是回到浏览器发现,控制台报错了(虽然报错,但功能正常)。浏览器提示说我的slice未定义,可是,这个slice()是个方法啊。咱就继续找问题。computed: {operateName() {if (this.treeNode.code === '11111000') {return '二级学院'} else if (this.tree
·
出现问题:
我的计算属性在这儿进行了slice的字符串切片,但是回到浏览器发现,控制台报错了(虽然报错,但功能正常)。浏览器提示说我的slice未定义,可是,这个slice()是个方法啊。咱就继续找问题。
computed: {
operateName() {
if (this.treeNode.code === '11111000') {
return '二级学院'
} else if (this.treeNode.code.slice(0, 4) === '1111') {
return '专业'
} else {
return '班级'
}
}
会不会是slice()前面的数据有问题?那就看看 treeNode.code 是怎么得到的,先是父组件调用接口,获取数据给树形组件。
父组件用插槽传给子组件1,。
子组件1将单个节点的数据回传给父组件。
父组件再将接收到的数据传给子组件2
这个数据是经历了2次数据传递,导致vue无法识别出其中是否有code属性,此时code值默认为undefind,再用slice()去分割就报错咯。
解决办法:
先判断是否存在code,再进行切片,浏览器就不会报错了。
computed: {
operateName() {
if (this.treeNode.code === '11111000') {
return '二级学院'
} else if (this.treeNode.code && this.treeNode.code.slice(0, 4) === '1111') {
return '专业'
} else {
return '班级'
}
}
更多推荐
已为社区贡献1条内容
所有评论(0)