遍历递归数结构,修改里的disabled值

返回参数中新增字段 disabled,后端给的值为1和2,

disabled==1时,代表该节点需要置灰,不可选中

现在需要将disabled的值,改为布尔类型;

后端给的数结构是对象类型,tree接收数组类型;

先将对象类型的数据,遍历递归,修改里面的disabled值,最后再加[ ],改为数组类型.

javascript 复制代码
this.setDisabledData(res.data.data);


    // 遍历递归
    setDisabledData(node) {
      let that = this;
      node.disabled == 1 ? (node.disabled = true) : (node.disabled = false);
      if (node.children && node.children.length > 0) {
        node.children.forEach(child => {
          that.setDisabledData(child);
        });
        node.children.every(child => {
          child.disabled == 1 ? (child.disabled = true) : (child.disabled = false);
        });
        this.assignerArr = [node];
      }
    },
javascript 复制代码
            <el-form-item label="关键字" class="cx-scroll-wrap">
              <el-input placeholder="输入关键字进行过滤" v-model="filterText" clearable></el-input>
              <div class="addScrollClass " :style="{ height: tableHeight }">
                <el-tree
                  icon-class="none"
                  :data="assignerArr"
                  :check-strictly="false"
                  show-checkbox
                  default-expand-all
                  node-key="id"
                  ref="tree"
                  :filter-node-method="filterNode"
                  highlight-current
                  :expand-on-click-node="false"
                  :props="props"
                >
                  <span class="custom-tree-node" slot-scope="{ node, data }">
                    <span>
                      <i v-if="data.type == 2" class="el-icon-coin cx-icon"></i>
                      <i v-else class="el-icon-user-solid cx-icon"></i>
                      {{ node.label }}
                    </span>
                  </span>
                </el-tree>
              </div>
            </el-form-item>
javascript 复制代码
      props: {
        label: "displayName",
        children: "children",
        isLeaf: "leaf",
        disabled: "disabled",
      },
相关推荐
大樊子9 分钟前
JavaScript 中的单例模式
开发语言·javascript·单例模式
白飞飞11 分钟前
原生小程序工程化指北:从混乱到规范的进化之路
前端·vue.js·微信小程序
加油乐14 分钟前
JS判断当前时间是否在指定时段内(支持多时段使用)
前端·javascript
PBitW27 分钟前
工作中突然发现零宽字符串的作用了!
前端·javascript·vue.js
VeryCool28 分钟前
React Native新架构升级实战【从 0.62 到 0.72】
前端·javascript·架构
狂炫一碗大米饭32 分钟前
大厂一面,刨析题型,把握趋势🔭💯
前端·javascript·面试
工业互联网专业36 分钟前
基于springboot+vue的校园二手物品交易平台
java·vue.js·spring boot·毕业设计·源码·课程设计·校园二手物品交易平台
加油乐44 分钟前
JS计算两个地理坐标点之间的距离(支持米与公里/千米)
前端·javascript
冷冷清清中的风风火火1 小时前
关于敏感文件或备份 安全配置错误 禁止通过 URL 访问 Vue 项目打包后的 .gz 压缩文件
前端·vue.js·安全
纪元A梦1 小时前
华为OD机试真题——数据分类(2025A卷:100分)Java/python/JavaScript/C++/C语言/GO六种最佳实现
java·javascript·c++·python·华为od·go·华为od机试题