js 递归循环树形结构，根据某个节点值为节点之前，当前节点，节点之后的对象添加不同的状态值

前言：目前有一个流程节点的数据，多层级树形结构。其中某个节点有一个参数isCurrent，当isCurrent为1的时候，说明是当前流程，isCurrent为0的时候，是已提交或者未提交。isCurrent：1之前的流程是已经提交过的，isCurrent：1之后的流程是未提交的。当前，已提交，未提交，需要展示三种颜色。现在要根据isCurrent：1为当前流程、已提交、未提交的对象添加三种不同的状态。

代码如下

//数据结构
  const obj = {
    
    
      name: '流程1',
      isCurrent: 0,
      childNode: {
    
    
        name: '流程2',
        isCurrent: 1,
        childNode: {
    
    
          name: '流程3',
          isCurrent: 0,
          childNode: {
    
    
            name: '流程4',
            isCurrent: 0
          }
        }
      }
    }

//数据处理
   const handleData = (node, type) => {
    
    
      for (const key in node) {
    
    
//首先找到isCurrent 1 当前环节，当前环节后面的childNode就是未流转的
        if (node.isCurrent == 1) {
    
    
          node.colorType = 2 //当前环节颜色
          if (node.childNode) {
    
    
            // 添加参数true代表这是未流转的childNode
            handleData(node.childNode, true)
          }
        }

        if (node.isCurrent == 0 && !type) {
    
    
          node.colorType = 1//已流转颜色
          if (node.childNode) {
    
    
            handleData(node.childNode, false)
          }
        }
        if (node.isCurrent == 0 && type) {
    
    
          node.colorType = 0 //未流转环节颜色
          if (node.childNode) {
    
    
            handleData(node.childNode, true)
          }
        }
      }
      return node
    }
//调用打印，首次调用，type为false
 console.log(handleData(obj))
 //数据如下
{
    
    
      'name': '流程1',
      'isCurrent': 0,
      'colorType': 1,
      'childNode': {
    
    
        'name': '流程2',
        'isCurrent': 1,
        'colorType': 2,
        'childNode': {
    
    
          'name': '流程3',
          'isCurrent': 0,
          'colorType': 0,
          'childNode': {
    
    
            'name': '流程4',
            'isCurrent': 0,
            'colorType': 0
          }
        }
      }
    }

效果图如下