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.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 '班级'
      }
    }