vxe-pc-ui 3.0.1 → 3.0.2

package/lib/tree/src/tree.js

@@ -0,0 +1,1324 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _comp = require("../../ui/src/comp");
+var _xeUtils = _interopRequireDefault(require("xe-utils"));
+var _ui = require("../../ui");
+var _vn = require("../../ui/src/vn");
+var _dom = require("../../ui/src/dom");
+var _loading = _interopRequireDefault(require("../../loading/src/loading"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+/**
+ * 生成节点的唯一主键
+ */
+function getNodeUniqueId() {
+  return _xeUtils.default.uniqueId('node_');
+}
+var _default2 = exports.default = (0, _comp.defineVxeComponent)({
+  name: 'VxeTree',
+  mixins: [_ui.globalMixins.sizeMixin],
+  props: {
+    data: Array,
+    height: [String, Number],
+    minHeight: {
+      type: [String, Number],
+      default: function _default() {
+        return (0, _ui.getConfig)().tree.minHeight;
+      }
+    },
+    loading: Boolean,
+    loadingConfig: Object,
+    accordion: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().tree.accordion;
+      }
+    },
+    childrenField: {
+      type: String,
+      default: function _default() {
+        return (0, _ui.getConfig)().tree.childrenField;
+      }
+    },
+    valueField: {
+      type: String,
+      default: function _default() {
+        return (0, _ui.getConfig)().tree.valueField;
+      }
+    },
+    keyField: {
+      type: String,
+      default: function _default() {
+        return (0, _ui.getConfig)().tree.keyField;
+      }
+    },
+    parentField: {
+      type: String,
+      default: function _default() {
+        return (0, _ui.getConfig)().tree.parentField;
+      }
+    },
+    titleField: {
+      type: String,
+      default: function _default() {
+        return (0, _ui.getConfig)().tree.titleField;
+      }
+    },
+    hasChildField: {
+      type: String,
+      default: function _default() {
+        return (0, _ui.getConfig)().tree.hasChildField;
+      }
+    },
+    // mapChildrenField: {
+    //   type: String as PropType<VxeTreePropTypes.MapChildrenField>,
+    //   default: () => getConfig().tree.mapChildrenField
+    // },
+    transform: Boolean,
+    // 已废弃
+    isCurrent: Boolean,
+    // 已废弃
+    isHover: Boolean,
+    showLine: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().tree.showLine;
+      }
+    },
+    trigger: String,
+    indent: {
+      type: Number,
+      default: function _default() {
+        return (0, _ui.getConfig)().tree.indent;
+      }
+    },
+    showRadio: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().tree.showRadio;
+      }
+    },
+    checkNodeKey: {
+      type: [String, Number],
+      default: function _default() {
+        return (0, _ui.getConfig)().tree.checkNodeKey;
+      }
+    },
+    radioConfig: Object,
+    showCheckbox: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().tree.showCheckbox;
+      }
+    },
+    checkNodeKeys: {
+      type: Array,
+      default: function _default() {
+        return (0, _ui.getConfig)().tree.checkNodeKeys;
+      }
+    },
+    checkboxConfig: Object,
+    nodeConfig: Object,
+    lazy: Boolean,
+    toggleMethod: Function,
+    loadMethod: Function,
+    showIcon: {
+      type: Boolean,
+      default: true
+    },
+    iconOpen: {
+      type: String,
+      default: function _default() {
+        return (0, _ui.getConfig)().tree.iconOpen;
+      }
+    },
+    iconClose: {
+      type: String,
+      default: function _default() {
+        return (0, _ui.getConfig)().tree.iconClose;
+      }
+    },
+    iconLoaded: {
+      type: String,
+      default: function _default() {
+        return (0, _ui.getConfig)().tree.iconLoaded;
+      }
+    },
+    size: {
+      type: String,
+      default: function _default() {
+        return (0, _ui.getConfig)().tree.size || (0, _ui.getConfig)().size;
+      }
+    }
+  },
+  data: function data() {
+    var xID = _xeUtils.default.uniqueId();
+    var reactData = {
+      currentNode: null,
+      nodeMaps: {},
+      selectRadioKey: null,
+      treeList: [],
+      treeExpandedMaps: {},
+      treeExpandLazyLoadedMaps: {},
+      selectCheckboxMaps: {},
+      indeterminateCheckboxMaps: {}
+    };
+    var internalData = {};
+    return {
+      xID: xID,
+      reactData: reactData,
+      internalData: internalData
+    };
+  },
+  computed: Object.assign(Object.assign({}, {}), {
+    computeTitleField: function computeTitleField() {
+      var $xeTree = this;
+      var props = $xeTree;
+      return props.titleField || 'title';
+    },
+    computeKeyField: function computeKeyField() {
+      var $xeTree = this;
+      var props = $xeTree;
+      return props.keyField || 'id';
+    },
+    computeValueField: function computeValueField() {
+      var $xeTree = this;
+      var props = $xeTree;
+      var keyField = $xeTree.computeKeyField;
+      return props.valueField || keyField;
+    },
+    computeParentField: function computeParentField() {
+      var $xeTree = this;
+      var props = $xeTree;
+      return props.parentField || 'parentId';
+    },
+    computeChildrenField: function computeChildrenField() {
+      var $xeTree = this;
+      var props = $xeTree;
+      return props.childrenField || 'children';
+    },
+    computeHasChildField: function computeHasChildField() {
+      var $xeTree = this;
+      var props = $xeTree;
+      return props.hasChildField || 'hasChild';
+    },
+    computeIsRowCurrent: function computeIsRowCurrent() {
+      var $xeTree = this;
+      var props = $xeTree;
+      var nodeOpts = $xeTree.computeNodeOpts;
+      var isCurrent = nodeOpts.isCurrent;
+      if (_xeUtils.default.isBoolean(isCurrent)) {
+        return isCurrent;
+      }
+      return props.isCurrent;
+    },
+    computeIsRowHover: function computeIsRowHover() {
+      var $xeTree = this;
+      var props = $xeTree;
+      var nodeOpts = $xeTree.computeNodeOpts;
+      var isHover = nodeOpts.isHover;
+      if (_xeUtils.default.isBoolean(isHover)) {
+        return isHover;
+      }
+      return props.isHover;
+    },
+    computeRadioOpts: function computeRadioOpts() {
+      var $xeTree = this;
+      var props = $xeTree;
+      return Object.assign({
+        showIcon: true
+      }, (0, _ui.getConfig)().tree.radioConfig, props.radioConfig);
+    },
+    computeCheckboxOpts: function computeCheckboxOpts() {
+      var $xeTree = this;
+      var props = $xeTree;
+      return Object.assign({
+        showIcon: true
+      }, (0, _ui.getConfig)().tree.checkboxConfig, props.checkboxConfig);
+    },
+    computeNodeOpts: function computeNodeOpts() {
+      var $xeTree = this;
+      var props = $xeTree;
+      return Object.assign({}, (0, _ui.getConfig)().tree.nodeConfig, props.nodeConfig);
+    },
+    computeLoadingOpts: function computeLoadingOpts() {
+      var $xeTree = this;
+      var props = $xeTree;
+      return Object.assign({}, (0, _ui.getConfig)().tree.loadingConfig, props.loadingConfig);
+    },
+    computeTreeStyle: function computeTreeStyle() {
+      var $xeTree = this;
+      var props = $xeTree;
+      var height = props.height,
+        minHeight = props.minHeight;
+      var stys = {};
+      if (height) {
+        stys.height = (0, _dom.toCssUnit)(height);
+      }
+      if (minHeight) {
+        stys.minHeight = (0, _dom.toCssUnit)(minHeight);
+      }
+      return stys;
+    }
+  }),
+  methods: {
+    //
+    // Method
+    //
+    dispatchEvent: function dispatchEvent(type, params, evnt) {
+      var $xeTree = this;
+      $xeTree.$emit(type, (0, _ui.createEvent)(evnt, {
+        $tree: $xeTree
+      }, params));
+    },
+    clearRadioNode: function clearRadioNode() {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      reactData.selectRadioKey = null;
+      return $xeTree.$nextTick();
+    },
+    clearCheckboxNode: function clearCheckboxNode() {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      reactData.selectCheckboxMaps = {};
+      return $xeTree.$nextTick();
+    },
+    setAllCheckboxNode: function setAllCheckboxNode(checked) {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      var selectMaps = Object.assign(reactData.selectCheckboxMaps);
+      var childrenField = $xeTree.computeChildrenField;
+      if (checked) {
+        _xeUtils.default.eachTree(reactData.treeList, function (node) {
+          var nodeid = $xeTree.getNodeId(node);
+          selectMaps[nodeid] = true;
+        }, {
+          children: childrenField
+        });
+      }
+      reactData.selectCheckboxMaps = selectMaps;
+      return $xeTree.$nextTick();
+    },
+    clearExpandNode: function clearExpandNode() {
+      var $xeTree = this;
+      return $xeTree.clearAllExpandNode();
+    },
+    clearAllExpandNode: function clearAllExpandNode() {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      _xeUtils.default.each(reactData.nodeMaps, function (nodeItem) {
+        nodeItem.treeLoaded = false;
+      });
+      reactData.treeExpandedMaps = {};
+      return $xeTree.$nextTick();
+    },
+    setExpandByNodeId: function setExpandByNodeId(nodeids, expanded) {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      var expandedMaps = Object.assign(reactData.treeExpandedMaps);
+      if (nodeids) {
+        if (!_xeUtils.default.isArray(nodeids)) {
+          nodeids = [nodeids];
+        }
+        nodeids.forEach(function (nodeid) {
+          $xeTree.handleSetExpand(nodeid, expanded, expandedMaps);
+        });
+        reactData.treeExpandedMaps = expandedMaps;
+      }
+      return $xeTree.$nextTick();
+    },
+    setExpandNode: function setExpandNode(nodes, expanded) {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      var expandedMaps = Object.assign(reactData.treeExpandedMaps);
+      if (nodes) {
+        if (!_xeUtils.default.isArray(nodes)) {
+          nodes = [nodes];
+        }
+        nodes.forEach(function (node) {
+          var nodeid = $xeTree.getNodeId(node);
+          $xeTree.handleSetExpand(nodeid, expanded, expandedMaps);
+        });
+        reactData.treeExpandedMaps = expandedMaps;
+      }
+      return $xeTree.$nextTick();
+    },
+    toggleExpandByNodeId: function toggleExpandByNodeId(nodeids) {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      var expandedMaps = Object.assign(reactData.treeExpandedMaps);
+      if (nodeids) {
+        if (!_xeUtils.default.isArray(nodeids)) {
+          nodeids = [nodeids];
+        }
+        nodeids.forEach(function (nodeid) {
+          $xeTree.handleSetExpand(nodeid, !expandedMaps[nodeid], expandedMaps);
+        });
+        reactData.treeExpandedMaps = expandedMaps;
+      }
+      return $xeTree.$nextTick();
+    },
+    toggleExpandNode: function toggleExpandNode(nodes) {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      var expandedMaps = Object.assign(reactData.treeExpandedMaps);
+      if (nodes) {
+        if (!_xeUtils.default.isArray(nodes)) {
+          nodes = [nodes];
+        }
+        nodes.forEach(function (node) {
+          var nodeid = $xeTree.getNodeId(node);
+          $xeTree.handleSetExpand(nodeid, !expandedMaps[nodeid], expandedMaps);
+        });
+        reactData.treeExpandedMaps = expandedMaps;
+      }
+      return $xeTree.$nextTick();
+    },
+    setAllExpandNode: function setAllExpandNode() {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      var expandedMaps = Object.assign(reactData.treeExpandedMaps);
+      var childrenField = $xeTree.computeChildrenField;
+      _xeUtils.default.eachTree(reactData.treeList, function (node) {
+        var nodeid = $xeTree.getNodeId(node);
+        expandedMaps[nodeid] = true;
+      }, {
+        children: childrenField
+      });
+      reactData.treeExpandedMaps = expandedMaps;
+      return $xeTree.$nextTick();
+    },
+    reloadExpandNode: function reloadExpandNode(node) {
+      var $xeTree = this;
+      var props = $xeTree;
+      var lazy = props.lazy;
+      if (lazy) {
+        $xeTree.clearExpandLoaded(node);
+        return $xeTree.handleAsyncTreeExpandChilds(node);
+      }
+      return $xeTree.$nextTick();
+    },
+    clearExpandLoaded: function clearExpandLoaded(node) {
+      var $xeTree = this;
+      var props = $xeTree;
+      var reactData = $xeTree.reactData;
+      var lazy = props.lazy;
+      var nodeMaps = reactData.nodeMaps;
+      if (lazy) {
+        var nodeItem = nodeMaps[$xeTree.getNodeId(node)];
+        if (nodeItem) {
+          nodeItem.treeLoaded = false;
+        }
+      }
+      return $xeTree.$nextTick();
+    },
+    /**
+     * 用于树结构，给行数据加载子节点
+     */
+    loadChildrenNode: function loadChildrenNode(node, childRecords) {
+      var $xeTree = this;
+      var props = $xeTree;
+      var reactData = $xeTree.reactData;
+      var lazy = props.lazy,
+        transform = props.transform;
+      var nodeMaps = reactData.nodeMaps;
+      if (!lazy) {
+        return Promise.resolve([]);
+      }
+      var childrenField = $xeTree.computeChildrenField;
+      var parentNodeItem = nodeMaps[$xeTree.getNodeId(node)];
+      var parentLevel = parentNodeItem ? parentNodeItem.level : 0;
+      var parentNodes = parentNodeItem ? parentNodeItem.nodes : [];
+      return $xeTree.createNode(childRecords).then(function (nodeList) {
+        _xeUtils.default.eachTree(nodeList, function (childRow, index, items, path, parent, nodes) {
+          var itemNodeId = $xeTree.getNodeId(childRow);
+          nodeMaps[itemNodeId] = {
+            item: node,
+            itemIndex: -1,
+            items: items,
+            parent: parent || parentNodeItem.item,
+            nodes: parentNodes.concat(nodes),
+            level: parentLevel + nodes.length,
+            lineCount: 0,
+            treeLoaded: false
+          };
+        }, {
+          children: childrenField
+        });
+        node[childrenField] = nodeList;
+        if (transform) {
+          node[childrenField] = nodeList;
+        }
+        $xeTree.updateNodeLine(node);
+        return nodeList;
+      });
+    },
+    getNodeId: function getNodeId(node) {
+      var $xeTree = this;
+      var valueField = $xeTree.computeValueField;
+      var nodeid = _xeUtils.default.get(node, valueField);
+      return _xeUtils.default.eqNull(nodeid) ? '' : encodeURIComponent(nodeid);
+    },
+    isExpandByNode: function isExpandByNode(node) {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      var treeExpandedMaps = reactData.treeExpandedMaps;
+      var nodeid = $xeTree.getNodeId(node);
+      return !!treeExpandedMaps[nodeid];
+    },
+    isCheckedByRadioNodeId: function isCheckedByRadioNodeId(nodeid) {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      var selectRadioKey = reactData.selectRadioKey;
+      return selectRadioKey === nodeid;
+    },
+    isCheckedByRadioNode: function isCheckedByRadioNode(node) {
+      var $xeTree = this;
+      return $xeTree.isCheckedByRadioNodeId($xeTree.getNodeId(node));
+    },
+    isCheckedByCheckboxNodeId: function isCheckedByCheckboxNodeId(nodeid) {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      var selectCheckboxMaps = reactData.selectCheckboxMaps;
+      return !!selectCheckboxMaps[nodeid];
+    },
+    isCheckedByCheckboxNode: function isCheckedByCheckboxNode(node) {
+      var $xeTree = this;
+      return $xeTree.isCheckedByCheckboxNodeId($xeTree.getNodeId(node));
+    },
+    isIndeterminateByCheckboxNodeid: function isIndeterminateByCheckboxNodeid(nodeid) {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      var indeterminateCheckboxMaps = reactData.indeterminateCheckboxMaps;
+      return !!indeterminateCheckboxMaps[nodeid];
+    },
+    isIndeterminateByCheckboxNode: function isIndeterminateByCheckboxNode(node) {
+      var $xeTree = this;
+      return $xeTree.isIndeterminateByCheckboxNodeid($xeTree.getNodeId(node));
+    },
+    emitCheckboxMode: function emitCheckboxMode(value) {
+      var $xeTree = this;
+      $xeTree.$emit('update:checkNodeKeys', value);
+    },
+    emitRadioMode: function emitRadioMode(value) {
+      var $xeTree = this;
+      $xeTree.$emit('update:checkNodeKey', value);
+    },
+    setRadioNode: function setRadioNode(node, checked) {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      if (node) {
+        reactData.selectRadioKey = checked ? $xeTree.getNodeId(node) : null;
+      }
+      return $xeTree.$nextTick();
+    },
+    setCheckboxNode: function setCheckboxNode(nodeList, checked) {
+      var $xeTree = this;
+      if (nodeList) {
+        if (!_xeUtils.default.isArray(nodeList)) {
+          nodeList = [nodeList];
+        }
+        $xeTree.handleCheckedCheckboxNode(nodeList.map(function (item) {
+          return $xeTree.getNodeId(item);
+        }), checked);
+      }
+      return $xeTree.$nextTick();
+    },
+    setCheckboxByNodeId: function setCheckboxByNodeId(nodeIds, checked) {
+      var $xeTree = this;
+      if (nodeIds) {
+        if (!_xeUtils.default.isArray(nodeIds)) {
+          nodeIds = [nodeIds];
+        }
+        $xeTree.handleCheckedCheckboxNode(nodeIds, checked);
+      }
+      return $xeTree.$nextTick();
+    },
+    handleCheckedCheckboxNode: function handleCheckedCheckboxNode(nodeIds, checked) {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      var selectKeyMaps = Object.assign({}, reactData.selectCheckboxMaps);
+      nodeIds.forEach(function (key) {
+        if (checked) {
+          selectKeyMaps[key] = true;
+        } else if (selectKeyMaps[key]) {
+          delete selectKeyMaps[key];
+        }
+      });
+      reactData.selectCheckboxMaps = selectKeyMaps;
+    },
+    updateCheckboxChecked: function updateCheckboxChecked(nodeIds) {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      var selectKeyMaps = {};
+      if (nodeIds) {
+        nodeIds.forEach(function (key) {
+          selectKeyMaps[key] = true;
+        });
+      }
+      reactData.selectCheckboxMaps = selectKeyMaps;
+    },
+    handleSetExpand: function handleSetExpand(nodeid, expanded, expandedMaps) {
+      if (expanded) {
+        if (expandedMaps[nodeid]) {
+          expandedMaps[nodeid] = true;
+        }
+      } else {
+        if (expandedMaps[nodeid]) {
+          delete expandedMaps[nodeid];
+        }
+      }
+    },
+    createNode: function createNode(records) {
+      var $xeTree = this;
+      var valueField = $xeTree.computeValueField;
+      return Promise.resolve(records.map(function (obj) {
+        var item = Object.assign({}, obj);
+        var nodeid = $xeTree.getNodeId(item);
+        if (!nodeid) {
+          nodeid = getNodeUniqueId();
+          _xeUtils.default.set(item, valueField, nodeid);
+        }
+        return item;
+      }));
+    },
+    cacheNodeMap: function cacheNodeMap() {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      var treeList = reactData.treeList;
+      var valueField = $xeTree.computeValueField;
+      var childrenField = $xeTree.computeChildrenField;
+      var keyMaps = {};
+      _xeUtils.default.eachTree(treeList, function (item, itemIndex, items, path, parent, nodes) {
+        var nodeid = $xeTree.getNodeId(item);
+        if (!nodeid) {
+          nodeid = getNodeUniqueId();
+          _xeUtils.default.set(item, valueField, nodeid);
+        }
+        keyMaps[nodeid] = {
+          item: item,
+          itemIndex: itemIndex,
+          items: items,
+          parent: parent,
+          nodes: nodes,
+          level: nodes.length,
+          lineCount: 0,
+          treeLoaded: false
+        };
+      }, {
+        children: childrenField
+      });
+      reactData.nodeMaps = keyMaps;
+    },
+    updateData: function updateData(list) {
+      var $xeTree = this;
+      var props = $xeTree;
+      var reactData = $xeTree.reactData;
+      var transform = props.transform;
+      var keyField = $xeTree.computeKeyField;
+      var parentField = $xeTree.computeParentField;
+      var childrenField = $xeTree.computeChildrenField;
+      if (transform) {
+        reactData.treeList = _xeUtils.default.toArrayTree(list, {
+          key: keyField,
+          parentKey: parentField,
+          mapChildren: childrenField
+        });
+      } else {
+        reactData.treeList = list ? list.slice(0) : [];
+      }
+      $xeTree.cacheNodeMap();
+    },
+    handleCountLine: function handleCountLine(item, isRoot, nodeItem) {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      var treeExpandedMaps = reactData.treeExpandedMaps;
+      var childrenField = $xeTree.computeChildrenField;
+      var nodeid = $xeTree.getNodeId(item);
+      nodeItem.lineCount++;
+      if (treeExpandedMaps[nodeid]) {
+        _xeUtils.default.arrayEach(item[childrenField], function (childItem, childIndex, childList) {
+          if (!isRoot || childIndex < childList.length - 1) {
+            $xeTree.handleCountLine(childItem, false, nodeItem);
+          }
+        });
+      }
+    },
+    updateNodeLine: function updateNodeLine(node) {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      var nodeMaps = reactData.nodeMaps;
+      if (node) {
+        var nodeid = $xeTree.getNodeId(node);
+        var nodeItem = nodeMaps[nodeid];
+        if (nodeItem) {
+          _xeUtils.default.lastArrayEach(nodeItem.nodes, function (childItem) {
+            var nodeid = $xeTree.getNodeId(childItem);
+            var nodeItem = nodeMaps[nodeid];
+            if (nodeItem) {
+              nodeItem.lineCount = 0;
+              $xeTree.handleCountLine(childItem, true, nodeItem);
+            }
+          });
+        }
+      }
+    },
+    handleNodeClickEvent: function handleNodeClickEvent(evnt, node) {
+      var $xeTree = this;
+      var props = $xeTree;
+      var reactData = $xeTree.reactData;
+      var showRadio = props.showRadio,
+        showCheckbox = props.showCheckbox,
+        trigger = props.trigger;
+      var radioOpts = $xeTree.computeRadioOpts;
+      var checkboxOpts = $xeTree.computeCheckboxOpts;
+      var isRowCurrent = $xeTree.computeIsRowCurrent;
+      var triggerCurrent = false;
+      var triggerRadio = false;
+      var triggerCheckbox = false;
+      var triggerExpand = false;
+      if (isRowCurrent) {
+        triggerCurrent = true;
+        $xeTree.changeCurrentEvent(evnt, node);
+      } else if (reactData.currentNode) {
+        reactData.currentNode = null;
+      }
+      if (trigger === 'node') {
+        triggerExpand = true;
+        $xeTree.toggleExpandEvent(evnt, node);
+      }
+      if (showRadio && radioOpts.trigger === 'node') {
+        triggerRadio = true;
+        $xeTree.changeRadioEvent(evnt, node);
+      }
+      if (showCheckbox && checkboxOpts.trigger === 'node') {
+        triggerCheckbox = true;
+        $xeTree.changeCheckboxEvent(evnt, node);
+      }
+      $xeTree.dispatchEvent('node-click', {
+        node: node,
+        triggerCurrent: triggerCurrent,
+        triggerRadio: triggerRadio,
+        triggerCheckbox: triggerCheckbox,
+        triggerExpand: triggerExpand
+      }, evnt);
+    },
+    handleNodeDblclickEvent: function handleNodeDblclickEvent(evnt, node) {
+      var $xeTree = this;
+      $xeTree.dispatchEvent('node-dblclick', {
+        node: node
+      }, evnt);
+    },
+    handleAsyncTreeExpandChilds: function handleAsyncTreeExpandChilds(node) {
+      var $xeTree = this;
+      var props = $xeTree;
+      var reactData = $xeTree.reactData;
+      var checkboxOpts = $xeTree.computeCheckboxOpts;
+      var loadMethod = props.loadMethod;
+      var checkStrictly = checkboxOpts.checkStrictly;
+      return new Promise(function (resolve) {
+        if (loadMethod) {
+          var treeExpandLazyLoadedMaps = reactData.treeExpandLazyLoadedMaps;
+          var nodeMaps = reactData.nodeMaps;
+          var nodeid = $xeTree.getNodeId(node);
+          var nodeItem = nodeMaps[nodeid];
+          treeExpandLazyLoadedMaps[nodeid] = true;
+          Promise.resolve(loadMethod({
+            $tree: $xeTree,
+            node: node
+          })).then(function (childRecords) {
+            nodeItem.treeLoaded = true;
+            if (treeExpandLazyLoadedMaps[nodeid]) {
+              delete treeExpandLazyLoadedMaps[nodeid];
+            }
+            if (!_xeUtils.default.isArray(childRecords)) {
+              childRecords = [];
+            }
+            if (childRecords) {
+              return $xeTree.loadChildrenNode(node, childRecords).then(function (childRows) {
+                var treeExpandedMaps = reactData.treeExpandedMaps;
+                if (childRows.length && !treeExpandedMaps[nodeid]) {
+                  treeExpandedMaps[nodeid] = true;
+                }
+                // 如果当前节点已选中，则展开后子节点也被选中
+                if (!checkStrictly && $xeTree.isCheckedByCheckboxNodeId(nodeid)) {
+                  $xeTree.handleCheckedCheckboxNode(childRows.map(function (item) {
+                    return $xeTree.getNodeId(item);
+                  }), true);
+                }
+                $xeTree.updateNodeLine(node);
+                $xeTree.dispatchEvent('load-success', {
+                  node: node,
+                  data: childRecords
+                }, new Event('load-success'));
+                return $xeTree.$nextTick();
+              });
+            } else {
+              $xeTree.updateNodeLine(node);
+              $xeTree.dispatchEvent('load-success', {
+                node: node,
+                data: childRecords
+              }, new Event('load-success'));
+            }
+          }).catch(function (e) {
+            var treeExpandLazyLoadedMaps = reactData.treeExpandLazyLoadedMaps;
+            nodeItem.treeLoaded = false;
+            if (treeExpandLazyLoadedMaps[nodeid]) {
+              delete treeExpandLazyLoadedMaps[nodeid];
+            }
+            $xeTree.updateNodeLine(node);
+            $xeTree.dispatchEvent('load-error', {
+              node: node,
+              data: e
+            }, new Event('load-error'));
+          }).finally(function () {
+            return $xeTree.$nextTick();
+          });
+        } else {
+          resolve();
+        }
+      });
+    },
+    /**
+     * 展开与收起树节点
+     * @param nodeList
+     * @param expanded
+     * @returns
+     */
+    handleBaseTreeExpand: function handleBaseTreeExpand(nodeList, expanded) {
+      var $xeTree = this;
+      var props = $xeTree;
+      var reactData = $xeTree.reactData;
+      var lazy = props.lazy,
+        accordion = props.accordion,
+        toggleMethod = props.toggleMethod;
+      var nodeMaps = reactData.nodeMaps,
+        treeExpandLazyLoadedMaps = reactData.treeExpandLazyLoadedMaps;
+      var tempExpandedMaps = Object.assign({}, reactData.treeExpandedMaps);
+      var childrenField = $xeTree.computeChildrenField;
+      var hasChildField = $xeTree.computeHasChildField;
+      var result = [];
+      var validNodes = toggleMethod ? nodeList.filter(function (node) {
+        return toggleMethod({
+          $tree: $xeTree,
+          expanded: expanded,
+          node: node
+        });
+      }) : nodeList;
+      if (accordion) {
+        validNodes = validNodes.length ? [validNodes[validNodes.length - 1]] : [];
+        // 同一级只能展开一个
+        var nodeid = $xeTree.getNodeId(validNodes[0]);
+        var nodeItem = nodeMaps[nodeid];
+        if (nodeItem) {
+          nodeItem.items.forEach(function (item) {
+            var itemNodeId = $xeTree.getNodeId(item);
+            if (tempExpandedMaps[itemNodeId]) {
+              delete tempExpandedMaps[itemNodeId];
+            }
+          });
+        }
+      }
+      var expandNodes = [];
+      if (expanded) {
+        validNodes.forEach(function (item) {
+          var itemNodeId = $xeTree.getNodeId(item);
+          if (!tempExpandedMaps[itemNodeId]) {
+            var _nodeItem = nodeMaps[itemNodeId];
+            var isLoad = lazy && item[hasChildField] && !_nodeItem.treeLoaded && !treeExpandLazyLoadedMaps[itemNodeId];
+            // 是否使用懒加载
+            if (isLoad) {
+              result.push($xeTree.handleAsyncTreeExpandChilds(item));
+            } else {
+              if (item[childrenField] && item[childrenField].length) {
+                tempExpandedMaps[itemNodeId] = true;
+                expandNodes.push(item);
+              }
+            }
+          }
+        });
+      } else {
+        validNodes.forEach(function (item) {
+          var itemNodeId = $xeTree.getNodeId(item);
+          if (tempExpandedMaps[itemNodeId]) {
+            delete tempExpandedMaps[itemNodeId];
+            expandNodes.push(item);
+          }
+        });
+      }
+      reactData.treeExpandedMaps = tempExpandedMaps;
+      expandNodes.forEach(function (node) {
+        $xeTree.updateNodeLine(node);
+      });
+      return Promise.all(result);
+    },
+    toggleExpandEvent: function toggleExpandEvent(evnt, node) {
+      var $xeTree = this;
+      var props = $xeTree;
+      var reactData = $xeTree.reactData;
+      var lazy = props.lazy;
+      var treeExpandedMaps = reactData.treeExpandedMaps,
+        treeExpandLazyLoadedMaps = reactData.treeExpandLazyLoadedMaps;
+      var nodeid = $xeTree.getNodeId(node);
+      var expanded = !treeExpandedMaps[nodeid];
+      evnt.stopPropagation();
+      if (!lazy || !treeExpandLazyLoadedMaps[nodeid]) {
+        $xeTree.handleBaseTreeExpand([node], expanded);
+      }
+    },
+    handleNodeCheckboxStatus: function handleNodeCheckboxStatus(node, selectKeyMaps, indeterminateMaps) {
+      var $xeTree = this;
+      var childrenField = $xeTree.computeChildrenField;
+      var childList = _xeUtils.default.get(node, childrenField);
+      var nodeid = $xeTree.getNodeId(node);
+      if (childList && childList.length) {
+        var checkSome = false;
+        var checkSize = 0;
+        childList.forEach(function (childNode) {
+          var childNodeid = $xeTree.getNodeId(childNode);
+          var isChecked = selectKeyMaps[childNodeid];
+          if (isChecked || indeterminateMaps[childNodeid]) {
+            if (isChecked) {
+              checkSize++;
+            }
+            checkSome = true;
+          }
+        });
+        var checkAll = checkSize === childList.length;
+        if (checkAll) {
+          if (!selectKeyMaps[nodeid]) {
+            selectKeyMaps[nodeid] = true;
+          }
+          if (indeterminateMaps[nodeid]) {
+            delete indeterminateMaps[nodeid];
+          }
+        } else {
+          if (selectKeyMaps[nodeid]) {
+            delete selectKeyMaps[nodeid];
+          }
+          indeterminateMaps[nodeid] = checkSome;
+        }
+      } else {
+        if (indeterminateMaps[nodeid]) {
+          delete indeterminateMaps[nodeid];
+        }
+      }
+    },
+    updateCheckboxStatus: function updateCheckboxStatus() {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      var treeList = reactData.treeList;
+      var childrenField = $xeTree.computeChildrenField;
+      var checkboxOpts = $xeTree.computeCheckboxOpts;
+      var checkStrictly = checkboxOpts.checkStrictly;
+      if (!checkStrictly) {
+        var selectKeyMaps = Object.assign({}, reactData.selectCheckboxMaps);
+        var indeterminateMaps = {};
+        _xeUtils.default.eachTree(treeList, function (node, index, items, path, parent, nodes) {
+          var childList = _xeUtils.default.get(node, childrenField);
+          if (!childList || !childList.length) {
+            $xeTree.handleNodeCheckboxStatus(node, selectKeyMaps, indeterminateMaps);
+          }
+          if (index === items.length - 1) {
+            for (var len = nodes.length - 2; len >= 0; len--) {
+              var parentItem = nodes[len];
+              $xeTree.handleNodeCheckboxStatus(parentItem, selectKeyMaps, indeterminateMaps);
+            }
+          }
+        });
+        reactData.selectCheckboxMaps = selectKeyMaps;
+        reactData.indeterminateCheckboxMaps = indeterminateMaps;
+      }
+    },
+    changeCheckboxEvent: function changeCheckboxEvent(evnt, node) {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      evnt.preventDefault();
+      evnt.stopPropagation();
+      var checkboxOpts = $xeTree.computeCheckboxOpts;
+      var checkStrictly = checkboxOpts.checkStrictly,
+        checkMethod = checkboxOpts.checkMethod;
+      var isDisabled = !!checkMethod;
+      if (checkMethod) {
+        isDisabled = !checkMethod({
+          node: node
+        });
+      }
+      if (isDisabled) {
+        return;
+      }
+      var selectKeyMaps = Object.assign({}, reactData.selectCheckboxMaps);
+      var childrenField = $xeTree.computeChildrenField;
+      var nodeid = $xeTree.getNodeId(node);
+      var isChecked = false;
+      if (selectKeyMaps[nodeid]) {
+        delete selectKeyMaps[nodeid];
+      } else {
+        isChecked = true;
+        selectKeyMaps[nodeid] = isChecked;
+      }
+      if (!checkStrictly) {
+        _xeUtils.default.eachTree(_xeUtils.default.get(node, childrenField), function (childNode) {
+          var childNodeid = $xeTree.getNodeId(childNode);
+          if (isChecked) {
+            if (!selectKeyMaps[childNodeid]) {
+              selectKeyMaps[childNodeid] = true;
+            }
+          } else {
+            if (selectKeyMaps[childNodeid]) {
+              delete selectKeyMaps[childNodeid];
+            }
+          }
+        }, {
+          children: childrenField
+        });
+      }
+      reactData.selectCheckboxMaps = selectKeyMaps;
+      $xeTree.updateCheckboxStatus();
+      var value = Object.keys(reactData.selectCheckboxMaps);
+      $xeTree.emitCheckboxMode(value);
+      $xeTree.dispatchEvent('checkbox-change', {
+        node: node,
+        value: value,
+        checked: isChecked
+      }, evnt);
+    },
+    changeCurrentEvent: function changeCurrentEvent(evnt, node) {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      evnt.preventDefault();
+      var nodeOpts = $xeTree.computeNodeOpts;
+      var currentMethod = nodeOpts.currentMethod,
+        trigger = nodeOpts.trigger;
+      var childrenField = $xeTree.computeChildrenField;
+      var childList = _xeUtils.default.get(node, childrenField);
+      var hasChild = childList && childList.length;
+      var isDisabled = !!currentMethod;
+      if (trigger === 'child') {
+        if (hasChild) {
+          return;
+        }
+      } else if (trigger === 'parent') {
+        if (!hasChild) {
+          return;
+        }
+      }
+      if (currentMethod) {
+        isDisabled = !currentMethod({
+          node: node
+        });
+      }
+      if (isDisabled) {
+        return;
+      }
+      var isChecked = true;
+      reactData.currentNode = node;
+      $xeTree.dispatchEvent('current-change', {
+        node: node,
+        checked: isChecked
+      }, evnt);
+    },
+    changeRadioEvent: function changeRadioEvent(evnt, node) {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      evnt.preventDefault();
+      evnt.stopPropagation();
+      var radioOpts = $xeTree.computeRadioOpts;
+      var checkMethod = radioOpts.checkMethod;
+      var isDisabled = !!checkMethod;
+      if (checkMethod) {
+        isDisabled = !checkMethod({
+          node: node
+        });
+      }
+      if (isDisabled) {
+        return;
+      }
+      var isChecked = true;
+      var value = $xeTree.getNodeId(node);
+      reactData.selectRadioKey = value;
+      $xeTree.emitRadioMode(value);
+      $xeTree.dispatchEvent('radio-change', {
+        node: node,
+        value: value,
+        checked: isChecked
+      }, evnt);
+    },
+    //
+    // Render
+    //
+    renderRadio: function renderRadio(h, node, nodeid, isChecked) {
+      var $xeTree = this;
+      var props = $xeTree;
+      var showRadio = props.showRadio;
+      var radioOpts = $xeTree.computeRadioOpts;
+      var showIcon = radioOpts.showIcon,
+        checkMethod = radioOpts.checkMethod,
+        visibleMethod = radioOpts.visibleMethod;
+      var isVisible = !visibleMethod || visibleMethod({
+        node: node
+      });
+      var isDisabled = !!checkMethod;
+      if (showRadio && showIcon && isVisible) {
+        if (checkMethod) {
+          isDisabled = !checkMethod({
+            node: node
+          });
+        }
+        return h('div', {
+          class: ['vxe-tree--radio-option', {
+            'is--checked': isChecked,
+            'is--disabled': isDisabled
+          }],
+          on: {
+            click: function click(evnt) {
+              if (!isDisabled) {
+                $xeTree.changeRadioEvent(evnt, node);
+              }
+            }
+          }
+        }, [h('span', {
+          class: ['vxe-radio--icon', isChecked ? (0, _ui.getIcon)().RADIO_CHECKED : (0, _ui.getIcon)().RADIO_UNCHECKED]
+        })]);
+      }
+      return (0, _ui.renderEmptyElement)($xeTree);
+    },
+    renderCheckbox: function renderCheckbox(h, node, nodeid, isChecked) {
+      var $xeTree = this;
+      var props = $xeTree;
+      var showCheckbox = props.showCheckbox;
+      var checkboxOpts = $xeTree.computeCheckboxOpts;
+      var showIcon = checkboxOpts.showIcon,
+        checkMethod = checkboxOpts.checkMethod,
+        visibleMethod = checkboxOpts.visibleMethod;
+      var isIndeterminate = $xeTree.isIndeterminateByCheckboxNodeid(nodeid);
+      var isVisible = !visibleMethod || visibleMethod({
+        node: node
+      });
+      var isDisabled = !!checkMethod;
+      if (showCheckbox && showIcon && isVisible) {
+        if (checkMethod) {
+          isDisabled = !checkMethod({
+            node: node
+          });
+        }
+        return h('div', {
+          class: ['vxe-tree--checkbox-option', {
+            'is--checked': isChecked,
+            'is--indeterminate': isIndeterminate,
+            'is--disabled': isDisabled
+          }],
+          on: {
+            click: function click(evnt) {
+              if (!isDisabled) {
+                $xeTree.changeCheckboxEvent(evnt, node);
+              }
+            }
+          }
+        }, [h('span', {
+          class: ['vxe-checkbox--icon', isIndeterminate ? (0, _ui.getIcon)().CHECKBOX_INDETERMINATE : isChecked ? (0, _ui.getIcon)().CHECKBOX_CHECKED : (0, _ui.getIcon)().CHECKBOX_UNCHECKED]
+        })]);
+      }
+      return (0, _ui.renderEmptyElement)($xeTree);
+    },
+    renderNode: function renderNode(h, node) {
+      var $xeTree = this;
+      var props = $xeTree;
+      var slots = $xeTree.$scopedSlots;
+      var reactData = $xeTree.reactData;
+      var lazy = props.lazy,
+        showRadio = props.showRadio,
+        showCheckbox = props.showCheckbox,
+        showLine = props.showLine,
+        indent = props.indent,
+        iconOpen = props.iconOpen,
+        iconClose = props.iconClose,
+        iconLoaded = props.iconLoaded,
+        showIcon = props.showIcon;
+      var nodeMaps = reactData.nodeMaps,
+        treeExpandedMaps = reactData.treeExpandedMaps,
+        currentNode = reactData.currentNode,
+        selectRadioKey = reactData.selectRadioKey,
+        treeExpandLazyLoadedMaps = reactData.treeExpandLazyLoadedMaps;
+      var childrenField = $xeTree.computeChildrenField;
+      var titleField = $xeTree.computeTitleField;
+      var hasChildField = $xeTree.computeHasChildField;
+      var childList = _xeUtils.default.get(node, childrenField);
+      var hasChild = childList && childList.length;
+      var titleSlot = slots.title;
+      var extraSlot = slots.extra;
+      var nodeid = $xeTree.getNodeId(node);
+      var isExpand = treeExpandedMaps[nodeid];
+      var nodeItem = nodeMaps[nodeid];
+      var nodeValue = _xeUtils.default.get(node, titleField);
+      var childVns = [];
+      if (hasChild && treeExpandedMaps[nodeid]) {
+        if (showLine) {
+          childVns.push(h('div', {
+            key: 'line',
+            class: 'vxe-tree--node-child-line',
+            style: {
+              height: "calc(".concat(nodeItem.lineCount, " * var(--vxe-ui-tree-node-height) - var(--vxe-ui-tree-node-height) / 2)"),
+              left: "".concat((nodeItem.level + 1) * (indent || 1), "px")
+            }
+          }));
+        }
+        childList.forEach(function (childItem) {
+          childVns.push($xeTree.renderNode(h, childItem));
+        });
+      }
+      var isRadioChecked = false;
+      if (showRadio) {
+        // eslint-disable-next-line eqeqeq
+        isRadioChecked = nodeid == selectRadioKey;
+      }
+      var isCheckboxChecked = false;
+      if (showCheckbox) {
+        isCheckboxChecked = $xeTree.isCheckedByCheckboxNodeId(nodeid);
+      }
+      var hasLazyChilds = false;
+      var isLazyLoading = false;
+      var isLazyLoaded = false;
+      if (lazy) {
+        isLazyLoading = !!treeExpandLazyLoadedMaps[nodeid];
+        hasLazyChilds = node[hasChildField];
+        isLazyLoaded = !!nodeItem.treeLoaded;
+      }
+      return h('div', {
+        class: ['vxe-tree--node-wrapper', "node--level-".concat(nodeItem.level)],
+        attrs: {
+          nodeid: nodeid
+        }
+      }, [h('div', {
+        class: ['vxe-tree--node-item', {
+          'is--current': currentNode && nodeid === $xeTree.getNodeId(currentNode),
+          'is-radio--checked': isRadioChecked,
+          'is-checkbox--checked': isCheckboxChecked
+        }],
+        style: {
+          paddingLeft: "".concat((nodeItem.level - 1) * (indent || 1), "px")
+        },
+        on: {
+          click: function click(evnt) {
+            $xeTree.handleNodeClickEvent(evnt, node);
+          },
+          dblclick: function dblclick(evnt) {
+            $xeTree.handleNodeDblclickEvent(evnt, node);
+          }
+        }
+      }, [showIcon || showLine ? h('div', {
+        class: 'vxe-tree--node-item-switcher'
+      }, showIcon && (lazy ? isLazyLoaded ? hasChild : hasLazyChilds : hasChild) ? [h('div', {
+        class: 'vxe-tree--node-item-icon',
+        on: {
+          click: function click(evnt) {
+            $xeTree.toggleExpandEvent(evnt, node);
+          }
+        }
+      }, [h('i', {
+        class: isLazyLoading ? iconLoaded || (0, _ui.getIcon)().TREE_NODE_LOADED : isExpand ? iconOpen || (0, _ui.getIcon)().TREE_NODE_OPEN : iconClose || (0, _ui.getIcon)().TREE_NODE_CLOSE
+      })])] : []) : (0, _ui.renderEmptyElement)($xeTree), $xeTree.renderRadio(h, node, nodeid, isRadioChecked), $xeTree.renderCheckbox(h, node, nodeid, isCheckboxChecked), h('div', {
+        class: 'vxe-tree--node-item-inner'
+      }, [h('div', {
+        class: 'vxe-tree--node-item-title'
+      }, titleSlot ? (0, _vn.getSlotVNs)(titleSlot({
+        node: node
+      })) : "".concat(nodeValue)), extraSlot ? h('div', {
+        class: 'vxe-tree--node-item-extra'
+      }, (0, _vn.getSlotVNs)(extraSlot({
+        node: node
+      }))) : (0, _ui.renderEmptyElement)($xeTree)])]), hasChild && treeExpandedMaps[nodeid] ? h('div', {
+        class: 'vxe-tree--node-child-wrapper'
+      }, childVns) : (0, _ui.renderEmptyElement)($xeTree)]);
+    },
+    renderNodeList: function renderNodeList(h) {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      var treeList = reactData.treeList;
+      return h('div', {
+        class: 'vxe-tree--node-list-wrapper'
+      }, treeList.map(function (node) {
+        return $xeTree.renderNode(h, node);
+      }));
+    },
+    renderVN: function renderVN(h) {
+      var $xeTree = this;
+      var props = $xeTree;
+      var slots = $xeTree.$scopedSlots;
+      var loading = props.loading,
+        trigger = props.trigger,
+        showLine = props.showLine;
+      var vSize = $xeTree.computeSize;
+      var radioOpts = $xeTree.computeRadioOpts;
+      var checkboxOpts = $xeTree.computeCheckboxOpts;
+      var treeStyle = $xeTree.computeTreeStyle;
+      var loadingOpts = $xeTree.computeLoadingOpts;
+      var isRowHover = $xeTree.computeIsRowHover;
+      var loadingSlot = slots.loading;
+      return h('div', {
+        ref: 'refElem',
+        class: ['vxe-tree', _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "size--".concat(vSize), vSize), 'show--line', showLine), 'checkbox--highlight', checkboxOpts.highlight), 'radio--highlight', radioOpts.highlight), 'node--hover', isRowHover), 'node--trigger', trigger === 'node'), 'is--loading', loading)],
+        style: treeStyle
+      }, [$xeTree.renderNodeList(h),
+      /**
+       * 加载中
+       */
+      h(_loading.default, {
+        class: 'vxe-tree--loading',
+        props: {
+          value: loading,
+          icon: loadingOpts.icon,
+          text: loadingOpts.text
+        },
+        scopedSlots: loadingSlot ? {
+          default: function _default() {
+            return loadingSlot({
+              $tree: $xeTree
+            });
+          }
+        } : {}
+      })]);
+    }
+  },
+  watch: {
+    data: function data(val) {
+      var $xeTree = this;
+      $xeTree.updateData(val || []);
+    },
+    checkNodeKey: function checkNodeKey(val) {
+      var $xeTree = this;
+      var reactData = $xeTree.reactData;
+      reactData.selectRadioKey = val;
+    },
+    checkNodeKeys: function checkNodeKeys() {
+      var $xeTree = this;
+      var props = $xeTree;
+      $xeTree.updateCheckboxChecked(props.checkNodeKeys || []);
+    }
+  },
+  created: function created() {
+    var $xeTree = this;
+    var props = $xeTree;
+    var reactData = $xeTree.reactData;
+    reactData.selectRadioKey = props.checkNodeKey || null;
+    $xeTree.updateData(props.data || []);
+    $xeTree.updateCheckboxChecked(props.checkNodeKeys || []);
+  },
+  beforeDestroy: function beforeDestroy() {
+    var $xeTree = this;
+    var reactData = $xeTree.reactData;
+    reactData.treeList = [];
+    reactData.treeExpandedMaps = {};
+    reactData.nodeMaps = {};
+  },
+  render: function render(h) {
+    return this.renderVN(h);
+  }
+});