增加示例

This commit is contained in:
yangchch6 2018-08-27 19:18:10 +08:00
parent b201beba7c
commit e82f2d9cd8
9 changed files with 630 additions and 202 deletions

View File

@ -5,7 +5,11 @@
/* Navlayout */
.u-checkbox {
display: inline-block;
position: relative; }
position: relative;
margin: 0 5px;
height: 18px;
line-height: 18px;
font-size: 14px; }
.u-checkbox.disabled .u-checkbox-label {
cursor: not-allowed;
opacity: 0.5; }
@ -44,7 +48,7 @@
width: 18px;
height: 18px;
left: 0;
top: 4px;
top: 0;
text-align: center;
position: absolute; }
.u-checkbox .u-checkbox-label:after {
@ -54,7 +58,7 @@
width: 18px;
height: 18px;
left: 0;
top: 4px;
top: 0;
text-align: center;
position: absolute; }

View File

@ -278,7 +278,7 @@ var TreeNode = function (_React$Component) {
});
}
//如果props.children的长度大于0才可以生成子对象
if (children && (children.type === TreeNode || allTreeNode)) {
if (children && children.length > 0 && (children.type === TreeNode || allTreeNode)) {
var _cls;
var cls = (_cls = {}, _defineProperty(_cls, props.prefixCls + '-child-tree', true), _defineProperty(_cls, props.prefixCls + '-child-tree-open', props.expanded), _cls);

85
demo/demolist/Demo10.js Normal file
View File

@ -0,0 +1,85 @@
/**
*
* @title Tree基本使用示例
* @description 如何获取选中对象自定义对象和数据
*
*/
import React, {
Component
} from 'react';
import Tree from '../../src';
const TreeNode = Tree.TreeNode;
const defaultProps = {
keys: ['0-0-0', '0-0-1']
}
class Demo10 extends Component {
constructor(props) {
super(props);
const keys = this.props.keys;
this.state = {
defaultExpandedKeys: keys,
defaultSelectedKeys: keys,
defaultCheckedKeys:keys
// checkedKeys: {checked:keys},
};
}
/**
* 获取当前选中行的item对象
* @param {*} value
*/
onSelect(selectedKeys, e) {
console.log(`${selectedKeys} selected`);//获取key
let currentObject = {};
currentObject.title = e.node.props.title; //获取选中对象的数据
currentObject.key = e.node.props.eventKey;
console.log(currentObject);
}
onCheck = (checkedKeys) => {
let self = this;
console.log('onCheck', checkedKeys);
const cks = {
checked: checkedKeys.checked || checkedKeys,
};
// this.setState({checkedKeys:cks});
}
onDoubleClick=(key,treeNode)=>{
console.log('---onDblClick---'+key+'--treeNode--'+treeNode);
}
render() {
return (
<Tree className="myCls" showLine checkable
defaultExpandedKeys={this.state.defaultExpandedKeys}
defaultSelectedKeys={this.state.defaultSelectedKeys}
defaultCheckedKeys = {this.state.defaultCheckedKeys}
checkStrictly
onSelect={this.onSelect} onCheck={this.onCheck}
onDoubleClick={this.onDoubleClick}
>
<TreeNode title="parent 1" key="0-0" >
<TreeNode title="parent 1-0" key="0-0-0" disabled>
<TreeNode title="leaf" key="0-0-0-0" disableCheckbox />
<TreeNode title="leaf" key="0-0-0-1" />
</TreeNode>
<TreeNode title="parent 1-1" key="0-0-1">
<TreeNode title={<span style={{ color: '#08c' }}>sss</span>} key="0-0-1-0" />
</TreeNode>
<TreeNode title="parent 1-2" key="0-0-2" >
<TreeNode title="leaf" key="0-0-2-0" />
<TreeNode title="leaf" key="0-0-2-1" />
</TreeNode>
</TreeNode>
</Tree>
);
}
}
Demo10.defaultProps = defaultProps;
export default Demo10;

File diff suppressed because one or more lines are too long

12
dist/demo.css vendored
View File

@ -5208,7 +5208,11 @@ a, .mdl-accordion, .mdl-button, .mdl-card, .mdl-checkbox, .mdl-dropdown-menu,
/* Navlayout */
.u-checkbox {
display: inline-block;
position: relative; }
position: relative;
margin: 0 5px;
height: 18px;
line-height: 18px;
font-size: 14px; }
.u-checkbox.disabled .u-checkbox-label {
cursor: not-allowed;
opacity: 0.5; }
@ -5240,7 +5244,7 @@ a, .mdl-accordion, .mdl-button, .mdl-card, .mdl-checkbox, .mdl-dropdown-menu,
width: 18px;
height: 18px;
left: 0;
top: 4px;
top: 0;
text-align: center;
position: absolute; }
.u-checkbox .u-checkbox-label:after {
@ -5250,7 +5254,7 @@ a, .mdl-accordion, .mdl-button, .mdl-card, .mdl-checkbox, .mdl-dropdown-menu,
width: 18px;
height: 18px;
left: 0;
top: 4px;
top: 0;
text-align: center;
position: absolute; }
@ -6536,6 +6540,8 @@ input.u-button[type="submit"] {
.u-form-control:focus {
border-color: #66afe9;
outline: 0; }
.u-form-control::-ms-clear, .u-form-control ::-ms-reveal {
display: none; }
.u-form-control[disabled] {
background: #eee;

2
dist/demo.css.map vendored

File diff suppressed because one or more lines are too long

715
dist/demo.js vendored

File diff suppressed because one or more lines are too long

2
dist/demo.js.map vendored

File diff suppressed because one or more lines are too long

View File

@ -1,7 +1,5 @@
# Tree
## 代码演示
## API
## Tree