element tree数据封装

个人日常代码记录 ,方便以后自己查阅

 <el-tree
        ref="tree"
        :data="treeData"
        show-checkbox
        :default-expanded-keys="[-2]"
         :default-checked-keys="resourceIdList"
        accordion
        :props="treeProps"
        node-key="resourceId"
      >
      </el-tree>
import {parseTree} from './parseTree.js'
data(){ 
	return{
	// 树结构
      treeData: [],
      // 树结构以什么展示
      showType: 1,
      treeProps: {
        children: "children",
        label: "resourceName",
      },
      resourceIdList: [], //资源id数
	}
},
methods:{
   /**
 * {"data":[{"systemId": 1,
"systemName": "统一后台管理系统",
"systemShortName": "统一后台管理系统","systemResource":[{
"parentId": -1,
"resourceId": 1,
"resourceName": "首页",
"sortNumber": 10,
"systemId": 1,
"systemName": "统一后台管理系统",
"systemShortName": "统一后台管理系统"
},{
"parentId": -1,
"resourceId": 2,
"resourceName": "组织用户管理",
"sortNumber": 20,
"systemId": 1,
"systemName": "统一后台管理系统",
"systemShortName": "统一后台管理系统"
},]}]}
 */

	async getTreeList(parentId) {
      const { data } = await deptResourcelist({ parentId: parentId });
      // // 重组第一层树ID
      this.treeData = data.map((v) => {
        return {
          parentId: -2,
          resourceId: -2,
          systemId: v.systemId,
          resourceName: v.systemName,
          children: parseTree(
            {
              key: "resourceId",
              parentKey: "parentId",
              childKey: "children",
            },
            v.systemResource
          ),
        };
      });
    }
}

parseTree.js


/**
 * 可以处理tree结构 
 * 比如写的递归tree时候 首先传入的 id 为一个固定值开始如:0,当有子树 不为 0 的时候 就会出错 
 * 
 *   parseTree(
            {
              key: "resourceId",
              parentKey: "parentId",
              childKey: "children",
            },
          数组
          ),
 */

var r = function (r) {
  var e = arguments.length > 1 && void 0 !== arguments[1] ? arguments[1] : {},
    n = arguments.length > 2 && void 0 !== arguments[2] ? arguments[2] : {};
  for (var t in e) r[t] = r[e[t]];
  for (var i in n) r[i] = n[i];
  return r
},
e = function (e) {
  var n = arguments.length > 1 && void 0 !== arguments[1] ? arguments[1] : {},
    t = arguments.length > 2 && void 0 !== arguments[2] ? arguments[2] : {};
  if (Array.isArray(e))
    for (var i = 0, l = e.length; i < l; i++) e[i] = r(e[i], n, t);
  else e = r(e, n, t);
  return e
},
n = function (r) {
  for (var e = arguments.length > 1 && void 0 !== arguments[1] ? arguments[1] : [], n = Array.isArray(e) ? e : [e], t = 0; t < n.length; t++) {
    delete r[n[t]]
  }
  return r
},
t = function (r) {
  var e = arguments.length > 1 && void 0 !== arguments[1] ? arguments[1] : [];
  for (var t in r)("undefined" === r[t] || null === r[t] || "" === r[t] || Array.isArray(r[t]) && 0 === r[t].length) && delete r[t];
  return n(r, e)
},
i = function () {
  var e = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : {
      key: "id",
      parentKey: "pid",
      childKey: "children"
    },
    n = arguments.length > 1 && void 0 !== arguments[1] ? arguments[1] : [],
    t = arguments.length > 2 && void 0 !== arguments[2] ? arguments[2] : {},
    i = arguments.length > 3 && void 0 !== arguments[3] ? arguments[3] : {},
    l = e.key,
    o = e.parentKey,
    a = e.childKey;
  if (!Array.isArray(n)) return [n];
  for (var v = [], h = {}, d = 0, f = n.length; d < f; d++) n[d] = r(n[d], t, i), h[n[d][l]] = n[d];
  for (var g = 0, u = n.length; g < u; g++) h[n[g][o]] && n[g][l] !== n[g][o] ? (h[n[g][o]][a] || (h[n[g][o]][a] = []), h[n[g][o]][a].push(n[g])) : v.push(n[g]);
  return v
};
export {
t as deleteEmptyProperty, n as deleteProperty, e as extendProperty, i as parseTree
};

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值