antdvue禁用某个特定节点tree数据

最新推荐文章于 2024-07-12 16:26:30 发布

小哞哞张

最新推荐文章于 2024-07-12 16:26:30 发布

阅读量203

点赞数

文章标签： java 前端服务器

本文链接：https://blog.csdn.net/m0_68965080/article/details/134166028

版权

【需求】当tree数据中的roleId与844181735249182730相等时，禁用该节点。同时禁用父节点。

【tree数据】

以下数据是接口返回的数据

tree = res.data

{
    "code": "200",
    "message": "查询成功",
    "data": [
        {
            "roles": [
                {
                    "roleId": "844181735249182730",
                    "roleName": "用户"
                },
                {
                    "roleId": "849287685977772034",
                    "roleName": "反查角色"
                }
            ],
            "projectName": "项目",
            "projectId": 200037
        },
        {
            "roles": [
                {
                    "roleId": "848870500742565889",
                    "roleName": "分管领导"
                },
                {
                    "pinyin": "shangwuyanshi",
                    "roleId": "848870500746760193",
                    "roleName": "商务演示",
                    "remark": "商务演示",
                    "fk_project_id": 200098
                }
            ],
            "projectName": "测试1",
            "projectId": 200098
        },
        {
            "roles": [
                {
                    "roleId": "844181735450509317",
                    "roleName": "客服员"
                },
                {
                    "roleId": "844181735450509315",
                    "roleName": "客户"
                },
                {
                    "roleId": "844181735450509316",
                    "roleName": "收费员"
                }
            ],
            "projectName": "测试项目02",
            "projectId": 200041
        }
      ]
}

【处理数据】

param = res.data

注意：以下方法是有返回值的，返回全部数据

    rootNode (param) { //param是需要处理的tree数据
      param.forEach(t => {
        this.getRoleNode(t)
      })
      return param
    },
    getRoleNode (node) {
      if (node && node.roleId === '844181735249182730') {
        node.disabled = true
      }
      if (node.roles && node.roles.length > 0) {
        node.disabled = true
        node.roles.forEach(e => {
          this.getRoleNode(e)
        })
      }
      return node
    }

【处理后的数据】


 [
        {
            "roles": [
                {
                    "roleId": "844181735249182730",
                    "disabled": "true",
                    "roleName": "用户"
                },
                {
                    "roleId": "849287685977772034",
                    "roleName": "反查角色"
                }
            ],
            "projectName": "项目",
            "disabled": "true",
            "projectId": 200037
        },
        {
            "roles": [
                {
                    "roleId": "848870500742565889",
                    "roleName": "分管领导"
                },
                {
                    "pinyin": "shangwuyanshi",
                    "roleId": "848870500746760193",
                    "roleName": "商务演示",
                    "remark": "商务演示",
                    "fk_project_id": 200098
                }
            ],
            "projectName": "测试1",
            "disabled": "true",
            "projectId": 200098
        },
        {
            "roles": [
                {
                    "roleId": "844181735450509317",
                    "roleName": "客服员"
                },
                {
                    "roleId": "844181735450509315",
                    "roleName": "客户"
                },
                {
                    "roleId": "844181735450509316",
                    "roleName": "收费员"
                }
            ],
            "projectName": "测试项目02",
            "disabled": "true",
            "projectId": 200041
        }
    ]