feat(bee-tree): TreeNode支持className和style

TreeNode支持className和style
This commit is contained in:
liushzh 2018-02-05 11:16:47 +08:00
parent 5a7c5a43ec
commit 04ba8c0a7d
6 changed files with 21 additions and 12 deletions

View File

@ -328,10 +328,11 @@ var TreeNode = function (_React$Component) {
var iconEleCls = (_iconEleCls = {}, _defineProperty(_iconEleCls, prefixCls + '-iconEle', true), _defineProperty(_iconEleCls, prefixCls + '-icon_loading', this.state.dataLoading), _defineProperty(_iconEleCls, prefixCls + '-icon__' + iconState, true), _iconEleCls); var iconEleCls = (_iconEleCls = {}, _defineProperty(_iconEleCls, prefixCls + '-iconEle', true), _defineProperty(_iconEleCls, prefixCls + '-icon_loading', this.state.dataLoading), _defineProperty(_iconEleCls, prefixCls + '-icon__' + iconState, true), _iconEleCls);
var selectHandle = function selectHandle() { var selectHandle = function selectHandle() {
var titleClass = props.className ? prefixCls + '-title' + ' ' + props.className : prefixCls + '-title';
var icon = props.showIcon || props.loadData && _this4.state.dataLoading ? _react2["default"].createElement('span', { className: (0, _classnames2["default"])(iconEleCls) }) : null; var icon = props.showIcon || props.loadData && _this4.state.dataLoading ? _react2["default"].createElement('span', { className: (0, _classnames2["default"])(iconEleCls) }) : null;
var title = _react2["default"].createElement( var title = _react2["default"].createElement(
'span', 'span',
{ className: prefixCls + '-title' }, { className: titleClass, style: props.style },
content content
); );
var wrap = prefixCls + '-node-content-wrapper'; var wrap = prefixCls + '-node-content-wrapper';
@ -412,7 +413,7 @@ var TreeNode = function (_React$Component) {
var cls = (_cls2 = {}, _defineProperty(_cls2, prefixCls + '-switcher', true), _defineProperty(_cls2, prefixCls + '-switcher-noop', true), _cls2); var cls = (_cls2 = {}, _defineProperty(_cls2, prefixCls + '-switcher', true), _defineProperty(_cls2, prefixCls + '-switcher-noop', true), _cls2);
if (props.showLine) { if (props.showLine) {
console.log('line---------'); // console.log('line---------');
cls[prefixCls + '-center_docu'] = !props.last; cls[prefixCls + '-center_docu'] = !props.last;
cls[prefixCls + '-bottom_docu'] = props.last; cls[prefixCls + '-bottom_docu'] = props.last;
} else { } else {
@ -447,7 +448,9 @@ TreeNode.propTypes = {
root: _propTypes2["default"].object, root: _propTypes2["default"].object,
onSelect: _propTypes2["default"].func, onSelect: _propTypes2["default"].func,
openIcon: _propTypes2["default"].element, openIcon: _propTypes2["default"].element,
closeIcon: _propTypes2["default"].element closeIcon: _propTypes2["default"].element,
style: _propTypes2["default"].object,
className: _propTypes2["default"].string
}; };
TreeNode.defaultProps = { TreeNode.defaultProps = {

2
dist/demo.css.map vendored

File diff suppressed because one or more lines are too long

9
dist/demo.js vendored
View File

@ -7823,10 +7823,11 @@
var iconEleCls = (_iconEleCls = {}, _defineProperty(_iconEleCls, prefixCls + '-iconEle', true), _defineProperty(_iconEleCls, prefixCls + '-icon_loading', this.state.dataLoading), _defineProperty(_iconEleCls, prefixCls + '-icon__' + iconState, true), _iconEleCls); var iconEleCls = (_iconEleCls = {}, _defineProperty(_iconEleCls, prefixCls + '-iconEle', true), _defineProperty(_iconEleCls, prefixCls + '-icon_loading', this.state.dataLoading), _defineProperty(_iconEleCls, prefixCls + '-icon__' + iconState, true), _iconEleCls);
var selectHandle = function selectHandle() { var selectHandle = function selectHandle() {
var titleClass = props.className ? prefixCls + '-title' + ' ' + props.className : prefixCls + '-title';
var icon = props.showIcon || props.loadData && _this4.state.dataLoading ? _react2['default'].createElement('span', { className: (0, _classnames2['default'])(iconEleCls) }) : null; var icon = props.showIcon || props.loadData && _this4.state.dataLoading ? _react2['default'].createElement('span', { className: (0, _classnames2['default'])(iconEleCls) }) : null;
var title = _react2['default'].createElement( var title = _react2['default'].createElement(
'span', 'span',
{ className: prefixCls + '-title' }, { className: titleClass, style: props.style },
content content
); );
var wrap = prefixCls + '-node-content-wrapper'; var wrap = prefixCls + '-node-content-wrapper';
@ -7907,7 +7908,7 @@
var cls = (_cls2 = {}, _defineProperty(_cls2, prefixCls + '-switcher', true), _defineProperty(_cls2, prefixCls + '-switcher-noop', true), _cls2); var cls = (_cls2 = {}, _defineProperty(_cls2, prefixCls + '-switcher', true), _defineProperty(_cls2, prefixCls + '-switcher-noop', true), _cls2);
if (props.showLine) { if (props.showLine) {
console.log('line---------'); // console.log('line---------');
cls[prefixCls + '-center_docu'] = !props.last; cls[prefixCls + '-center_docu'] = !props.last;
cls[prefixCls + '-bottom_docu'] = props.last; cls[prefixCls + '-bottom_docu'] = props.last;
} else { } else {
@ -7942,7 +7943,9 @@
root: _propTypes2['default'].object, root: _propTypes2['default'].object,
onSelect: _propTypes2['default'].func, onSelect: _propTypes2['default'].func,
openIcon: _propTypes2['default'].element, openIcon: _propTypes2['default'].element,
closeIcon: _propTypes2['default'].element closeIcon: _propTypes2['default'].element,
style: _propTypes2['default'].object,
className: _propTypes2['default'].string
}; };
TreeNode.defaultProps = { TreeNode.defaultProps = {

2
dist/demo.js.map vendored

File diff suppressed because one or more lines are too long

View File

@ -1,6 +1,6 @@
{ {
"name": "bee-tree", "name": "bee-tree",
"version": "1.0.6", "version": "1.0.7",
"description": "Tree ui component for react", "description": "Tree ui component for react",
"keywords": [ "keywords": [
"react", "react",

View File

@ -290,9 +290,10 @@ class TreeNode extends React.Component {
[`${prefixCls}-icon__${iconState}`]: true [`${prefixCls}-icon__${iconState}`]: true
}; };
const selectHandle = () => { const selectHandle = () => {
const titleClass=props.className?prefixCls+'-title'+' '+props.className:prefixCls+'-title';
const icon = (props.showIcon || props.loadData && this.state.dataLoading) ? const icon = (props.showIcon || props.loadData && this.state.dataLoading) ?
<span className={classNames(iconEleCls)}></span> : null; <span className={classNames(iconEleCls)}></span> : null;
const title = <span className={`${prefixCls}-title`}>{content}</span>; const title = <span className={titleClass} style={props.style}>{content}</span>;
const wrap = `${prefixCls}-node-content-wrapper`; const wrap = `${prefixCls}-node-content-wrapper`;
const domProps = { const domProps = {
className: `${wrap} ${wrap}-${iconState === expandedState ? iconState : 'normal'}`, className: `${wrap} ${wrap}-${iconState === expandedState ? iconState : 'normal'}`,
@ -371,7 +372,7 @@ class TreeNode extends React.Component {
[`${prefixCls}-switcher-noop`]: true, [`${prefixCls}-switcher-noop`]: true,
}; };
if (props.showLine) { if (props.showLine) {
console.log('line---------'); // console.log('line---------');
cls[`${prefixCls}-center_docu`] = !props.last; cls[`${prefixCls}-center_docu`] = !props.last;
cls[`${prefixCls}-bottom_docu`] = props.last; cls[`${prefixCls}-bottom_docu`] = props.last;
} else { } else {
@ -404,7 +405,9 @@ TreeNode.propTypes = {
root: PropTypes.object, root: PropTypes.object,
onSelect: PropTypes.func, onSelect: PropTypes.func,
openIcon: PropTypes.element, openIcon: PropTypes.element,
closeIcon: PropTypes.element closeIcon: PropTypes.element,
style: PropTypes.object,
className: PropTypes.string
}; };
TreeNode.defaultProps = { TreeNode.defaultProps = {