判断是否为叶子节点的优先级改成isLeaf>props.children

This commit is contained in:
wanghaoo 2019-01-10 13:39:34 +08:00
parent 2f0e5e0356
commit 9d5125aeef
6 changed files with 226 additions and 25 deletions

View File

@ -59,6 +59,21 @@ var TreeNode = function (_React$Component) {
var _this2 = _possibleConstructorReturn(this, _React$Component.call(this, props));
_this2.getNodeChildren = function () {
var children = _this2.props.children;
var originList = (0, _util.toArray)(children).filter(function (node) {
return node;
});
var targetList = (0, _util.getNodeChildren)(originList);
if (originList.length !== targetList.length) {
(0, _util.warnOnlyTreeNode)();
}
return targetList;
};
['onExpand', 'onCheck', 'onContextMenu', 'onMouseEnter', 'onMouseLeave', 'onDragStart', 'onDragEnter', 'onDragOver', 'onDragLeave', 'onDrop', 'onDragEnd', 'onDoubleClick', 'onKeyDown'].forEach(function (m) {
_this2[m] = _this2[m].bind(_this2);
});
@ -330,6 +345,27 @@ var TreeNode = function (_React$Component) {
return newChildren;
};
/**
*判断是否为叶子节点isLeaf的优先级>props.children如果是异步加载是根据isLeaf的值进行判断的
*
* @returns
* @memberof TreeNode
*/
TreeNode.prototype.checkIsLeaf = function checkIsLeaf() {
var _props = this.props,
isLeaf = _props.isLeaf,
loadData = _props.loadData;
var hasChildren = this.getNodeChildren().length !== 0;
if (isLeaf === false) {
return false;
}
return isLeaf || !loadData && !hasChildren;
};
TreeNode.prototype.render = function render() {
var _iconEleCls,
_this4 = this;
@ -350,13 +386,17 @@ var TreeNode = function (_React$Component) {
var delay = 500;
var prevent = false;
if (!newChildren || newChildren === props.children) {
// content = newChildren;
newChildren = null;
if (!props.loadData || props.isLeaf) {
canRenderSwitcher = false;
iconState = 'docu';
}
// if (!newChildren || newChildren === props.children) {
// // content = newChildren;
// newChildren = null;
// if (!props.loadData || props.isLeaf) {
// canRenderSwitcher = false;
// iconState = 'docu';
// }
// }
if (this.checkIsLeaf()) {
canRenderSwitcher = false;
iconState = 'docu';
}
// For performance, does't render children into dom when `!props.expanded` (move to Animate)
// if (!props.expanded) {

View File

@ -13,6 +13,10 @@ exports.getCheck = getCheck;
exports.getStrictlyValue = getStrictlyValue;
exports.arraysEqual = arraysEqual;
exports.closest = closest;
exports.isTreeNode = isTreeNode;
exports.toArray = toArray;
exports.getNodeChildren = getNodeChildren;
exports.warnOnlyTreeNode = warnOnlyTreeNode;
var _react = require('react');
@ -338,4 +342,29 @@ function closest(el, selector) {
}
}
return null;
}
function isTreeNode(node) {
return node && node.type && node.type.isTreeNode;
}
function toArray(children) {
var ret = [];
_react2["default"].Children.forEach(children, function (c) {
ret.push(c);
});
return ret;
}
function getNodeChildren(children) {
return toArray(children).filter(isTreeNode);
}
var onlyTreeNodeWarned = false;
function warnOnlyTreeNode() {
if (onlyTreeNodeWarned) return;
onlyTreeNodeWarned = true;
warning(false, 'Tree only accept TreeNode as children.');
}

84
dist/demo.js vendored
View File

@ -8740,7 +8740,6 @@
// 如果是多选tree则进行选中或者反选该节点
this.onCheck(treeNode);
} else if (e.keyCode == _tinperBeeCore.KeyCode.ENTER) {
console.log('keyCode***' + e.keyCode);
this.onDoubleClick(treeNode);
}
// e.preventDefault();
@ -9100,6 +9099,10 @@
exports.getStrictlyValue = getStrictlyValue;
exports.arraysEqual = arraysEqual;
exports.closest = closest;
exports.isTreeNode = isTreeNode;
exports.toArray = toArray;
exports.getNodeChildren = getNodeChildren;
exports.warnOnlyTreeNode = warnOnlyTreeNode;
var _react = __webpack_require__(4);
@ -9426,6 +9429,31 @@
}
return null;
}
function isTreeNode(node) {
return node && node.type && node.type.isTreeNode;
}
function toArray(children) {
var ret = [];
_react2['default'].Children.forEach(children, function (c) {
ret.push(c);
});
return ret;
}
function getNodeChildren(children) {
return toArray(children).filter(isTreeNode);
}
var onlyTreeNodeWarned = false;
function warnOnlyTreeNode() {
if (onlyTreeNodeWarned) return;
onlyTreeNodeWarned = true;
warning(false, 'Tree only accept TreeNode as children.');
}
/***/ }),
/* 88 */
@ -9492,6 +9520,21 @@
var _this2 = _possibleConstructorReturn(this, _React$Component.call(this, props));
_this2.getNodeChildren = function () {
var children = _this2.props.children;
var originList = (0, _util.toArray)(children).filter(function (node) {
return node;
});
var targetList = (0, _util.getNodeChildren)(originList);
if (originList.length !== targetList.length) {
(0, _util.warnOnlyTreeNode)();
}
return targetList;
};
['onExpand', 'onCheck', 'onContextMenu', 'onMouseEnter', 'onMouseLeave', 'onDragStart', 'onDragEnter', 'onDragOver', 'onDragLeave', 'onDrop', 'onDragEnd', 'onDoubleClick', 'onKeyDown'].forEach(function (m) {
_this2[m] = _this2[m].bind(_this2);
});
@ -9763,6 +9806,27 @@
return newChildren;
};
/**
*判断是否为叶子节点isLeaf的优先级>props.children如果是异步加载是根据isLeaf的值进行判断的
*
* @returns
* @memberof TreeNode
*/
TreeNode.prototype.checkIsLeaf = function checkIsLeaf() {
var _props = this.props,
isLeaf = _props.isLeaf,
loadData = _props.loadData;
var hasChildren = this.getNodeChildren().length !== 0;
if (isLeaf === false) {
return false;
}
return isLeaf || !loadData && !hasChildren;
};
TreeNode.prototype.render = function render() {
var _iconEleCls,
_this4 = this;
@ -9783,13 +9847,17 @@
var delay = 500;
var prevent = false;
if (!newChildren || newChildren === props.children) {
// content = newChildren;
newChildren = null;
if (!props.loadData || props.isLeaf) {
canRenderSwitcher = false;
iconState = 'docu';
}
// if (!newChildren || newChildren === props.children) {
// // content = newChildren;
// newChildren = null;
// if (!props.loadData || props.isLeaf) {
// canRenderSwitcher = false;
// iconState = 'docu';
// }
// }
if (this.checkIsLeaf()) {
canRenderSwitcher = false;
iconState = 'docu';
}
// For performance, does't render children into dom when `!props.expanded` (move to Animate)
// if (!props.expanded) {

2
dist/demo.js.map vendored

File diff suppressed because one or more lines are too long

View File

@ -3,7 +3,10 @@ import ReactDOM from 'react-dom'
import classNames from 'classnames';
import Animate from 'bee-animate';
import {
browser
browser,
getNodeChildren,
toArray,
warnOnlyTreeNode
} from './util';
import PropTypes from 'prop-types';
import { KeyCode } from 'tinper-bee-core';
@ -251,6 +254,7 @@ class TreeNode extends React.Component {
break;
}
}
}else if(children && children.type && children.type.isTreeNode == 1){
allTreeNode = true;
}
@ -289,6 +293,36 @@ class TreeNode extends React.Component {
return newChildren;
}
getNodeChildren = () => {
const { children } = this.props;
const originList = toArray(children).filter(node => node);
const targetList = getNodeChildren(originList);
if (originList.length !== targetList.length) {
warnOnlyTreeNode();
}
return targetList;
};
/**
*判断是否为叶子节点isLeaf的优先级>props.children如果是异步加载是根据isLeaf的值进行判断的
*
* @returns
* @memberof TreeNode
*/
checkIsLeaf(){
const { isLeaf, loadData } = this.props;
const hasChildren = this.getNodeChildren().length !== 0;
if (isLeaf === false) {
return false;
}
return (
isLeaf || (!loadData && !hasChildren)
);
}
render() {
const props = this.props;
const prefixCls = props.prefixCls;
@ -306,13 +340,17 @@ class TreeNode extends React.Component {
let delay = 500;
let prevent = false;
if (!newChildren || newChildren === props.children) {
// content = newChildren;
newChildren = null;
if (!props.loadData || props.isLeaf) {
canRenderSwitcher = false;
iconState = 'docu';
}
// if (!newChildren || newChildren === props.children) {
// // content = newChildren;
// newChildren = null;
// if (!props.loadData || props.isLeaf) {
// canRenderSwitcher = false;
// iconState = 'docu';
// }
// }
if(this.checkIsLeaf()){
canRenderSwitcher = false;
iconState = 'docu';
}
// For performance, does't render children into dom when `!props.expanded` (move to Animate)
// if (!props.expanded) {

View File

@ -297,4 +297,30 @@ export function closest(el, selector) {
}
}
return null;
}
}
export function isTreeNode(node) {
return node && node.type && node.type.isTreeNode;
}
export function toArray(children) {
const ret = [];
React.Children.forEach(children, (c) => {
ret.push(c);
});
return ret;
}
export function getNodeChildren(children) {
return toArray(children).filter(isTreeNode);
}
let onlyTreeNodeWarned = false;
export function warnOnlyTreeNode() {
if (onlyTreeNodeWarned) return;
onlyTreeNodeWarned = true;
warning(false, 'Tree only accept TreeNode as children.');
}