p47502813
/
bee-table
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fix(bee-table): 树形表格数据没有key无法展开bug

This commit is contained in:
liushaozhen 2020-04-01 14:54:41 +08:00
parent c9729d12ad
commit a24a865f7a
11 changed files with 32010 additions and 105566 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
build/lib/bigData.js
View File

@ -406,9 +406,9 @@ function bigData(Table) {
if (Array.isArray(dataCopy)) {
for (var i = 0, l = dataCopy.length; i < l; i++) {
var _dataCopy$i = dataCopy[i],
key = _dataCopy$i.key,
children = _dataCopy$i.children,
props = _objectWithoutProperties(_dataCopy$i, ["key", "children"]),
props = _objectWithoutProperties(_dataCopy$i, ["children"]),
key = _this4.getRowKey(dataCopy[i], i),
dataCopyI = new Object(),
_isLeaf = children && children.length > 0 ? false : true,
isExpanded = parentKey === null || expandedKeysSet.has(parentKey) ? expandedKeysSet.has(key) : false;

2
demo/demolist/Demo1102.js
View File

@ -123,7 +123,7 @@ class Demo4 extends Component {
selectedRow: selectedRow
});
}}
rowKey="key"//每条数据的唯一标示，默认为key，如果不是key，必须传
columns={columns4} data={data4} />;
}
}

1
demo/demolist/Demo1404.js
View File

@ -87,6 +87,7 @@ class Demo34 extends Component {
onRowClick={(record, index, indent) => {
console.log('currentIndex--' + index);
}}
rowKey="key"//每条数据的唯一标示，默认为key，如果不是key，必须传
/>
</div>

2
demo/index.js
View File

File diff suppressed because one or more lines are too long

237
dist/demo.css vendored
View File

@ -907,241 +907,4 @@
background: #344563;
border-color: #505F79; }
.demo04.u-table tr:nth-child(2n) {
background: #f7f9fb; }
.demo04.u-table tr.u-table-row-hover, .demo04 .u-table tr:hover {
background: #ebecf0; }
.demo22 .opt-btns {
margin-bottom: 8px; }
.demo32 .u-table-thead th {
padding-top: 0px;
padding-bottom: 0px; }
.demo0501 .u-table .u-row-hover .opt-btns button, .demo0501 .u-table .u-row-hover .cancel-btns button {
margin: 0; }
.demo0501 .u-table .u-row-hover .opt-btns button:first-child, .demo0501 .u-table .u-row-hover .cancel-btns button:first-child {
margin-right: 8px; }
.demo0501 .u-table .u-table-row td {
padding: 5px 8px; }
.demo0501 .u-table .u-table-row td input {
font-size: 12px;
padding-left: 5px; }
.demo0501 .u-table .u-table-row .u-form-control,
.demo0501 .u-table .u-table-row .u-select-selection {
height: 30px; }
.demo0501 .u-table .editable-cell-text-wrapper {
box-sizing: border-box;
line-height: 20px;
border-radius: 3px; }
.demo0501 .u-table .required {
margin-left: 10px;
position: relative; }
.demo0501 .u-table .required::before {
content: " ";
border: 1px solid #F44336;
width: 0;
height: 12px;
position: absolute;
top: 9px;
left: -8px; }
.demo0501 .u-table .required span.u-input-group {
display: block; }
.demo0501 .u-table .verify-cell {
padding-right: 25px !important; }
.demo0501 .u-table .required-icon {
position: absolute;
top: 2px;
color: #F44336;
font-size: 20px; }
.demo0501 .u-table .ref-input-wrap {
width: 160px !important; }
.u-editable-table-tp .tp-content {
color: #F44336; }
.u-editable-table .u-table .u-table-row td {
padding: 5px 8px; }
.u-editable-table .u-table .u-table-row td input {
padding-left: 5px;
font-size: 12px; }
.u-editable-table .u-table .u-table-row td input.error {
border-color: #F44336; }
.u-editable-table .u-table .u-table-row .editable-cell {
height: 30px; }
.u-editable-table .u-table .u-table-row-hover .editable-cell-text-wrapper {
line-height: 19px; }
.u-editable-table .u-table .u-table-row .u-form-control,
.u-editable-table .u-table .u-table-row .u-select-selection {
height: 30px; }
.u-editable-table .u-table .editable-cell-text-wrapper {
box-sizing: border-box;
line-height: 20px;
border-radius: 3px; }
.u-editable-table .u-table .editable-cell-input-wrapper {
padding-right: 0; }
.u-editable-table .u-table .editable-cell-input-wrapper .ref-input-wrap {
width: auto !important;
height: 30px; }
.u-editable-table .u-table .editable-cell-input-wrapper .ref-input-wrap .u-input-group {
display: inline-block; }
.u-editable-table .u-table .verify-cell {
padding-right: 25px !important; }
.u-editable-table .u-table .require {
position: absolute;
top: 2px;
color: #F44336;
font-size: 20px; }
.u-editable-table-tp .tp-content {
color: #F44336; }
.demo0503-m-b.u-modal .u-modal-body {
padding: 16px 0;
background: #f7f9fb; }
.demo0503-m-b .u-form-group {
overflow: hidden; }
.demo0503-m-b .u-form-control {
font-size: 12px; }
.demo0503-m-b .editable-cell {
display: block;
float: left;
width: 265px;
padding-right: 25px; }
.demo0503-m-b .ref-input-wrap {
width: 240px !important; }
.demo0503-m-b .u-label {
display: block;
float: left;
text-align: right;
width: 110px;
box-sizing: border-box;
padding-right: 10px;
font-size: 12px;
height: 32px;
line-height: 32px; }
.demo0503-m-b .u-label .mast {
padding: 0;
color: red; }
.demo0503-m-b .required-icon {
position: absolute;
top: 2px;
color: #F44336;
font-size: 20px; }
.u-editable-table-tp {
z-index: 9999 !important; }
.u-editable-table-tp .tp-content {
color: #F44336; }
.ref-core-button .u-button:first-child {
margin-right: 8px; }
.demo0505 .toolbar-btns {
margin-bottom: 8px; }
.demo0505 .toolbar-btns .u-button:first-child {
margin-right: 8px; }
.demo0505 .u-table .u-row-select {
background-color: #FFF7E7; }
.demo0505 .u-table .u-table-row td {
padding: 5px 8px; }
.demo0505 .u-table .u-table-row td input {
font-size: 12px;
padding-left: 5px; }
.demo0505 .u-table .u-table-row .u-form-control,
.demo0505 .u-table .u-table-row .u-select-selection {
height: 30px; }
.demo0505 .u-table .editable-cell-text-wrapper {
box-sizing: border-box;
line-height: 20px;
border-radius: 3px; }
.demo0505 .u-table .required {
margin-left: 10px;
position: relative; }
.demo0505 .u-table .required::before {
content: " ";
border: 1px solid #F44336;
width: 0;
height: 12px;
position: absolute;
top: 9px;
left: -8px; }
.demo0505 .u-table .required span.u-input-group {
display: block; }
.demo0505 .u-table .verify-cell {
padding-right: 25px !important; }
.demo0505 .u-table .edited::after {
content: " ";
position: absolute;
z-index: 999;
top: 0;
left: 0;
border-width: 5px;
border-style: solid;
border-color: #f44336 transparent transparent #f44336; }
.demo0505 .u-table .required-icon {
position: absolute;
top: 2px;
color: #F44336;
font-size: 20px; }
.demo0505 .u-table .ref-input-wrap {
width: 160px !important; }
.u-editable-table-tp .tp-content {
color: #F44336; }
th .drop-menu .uf {
font-size: 12px;
visibility: hidden;
margin-left: 15px; }
th:hover .uf {
visibility: visible; }
.expanded-table .expand-icon-con .uf {
font-size: 12px; }
.demo8 .u-table {
margin-bottom: 11px; }
.demo8 .u-pagination {
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: center;
justify-content: center; }
/*# sourceMappingURL=demo.css.map */

2
dist/demo.css.map vendored
View File

File diff suppressed because one or more lines are too long

137319
dist/demo.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/demo.js.map vendored
View File

File diff suppressed because one or more lines are too long

2
docs/api.md
View File

@ -43,7 +43,7 @@ import 'bee-table/build/Table.css';
| defaultExpandAllRows | 默认是否展开所有行 | bool | false |
| defaultExpandedRowKeys | 初始扩展行键 | array | [] |
| rowRef | 获取行的ref | Function(record, index, indent):string | () => null |
| rowKey | 如果rowKey是字符串，`record [rowKey]`将被用作键。如果rowKey是function，`rowKey（record, index）`的返回值将被用作键。 | string or Function(record, index):string | 'key' |
| rowKey | 如果rowKey是字符串，`record [rowKey]`将被用作键。如果rowKey是function，`rowKey（record, index）`的返回值将被用作键。树形表格时作为每条数据的唯一标示，如果唯一标示不是"key"键的值，则必须传入，例如 `rowKey='id'` | string or Function(record, index):string | 'key' |
| expandedRowKeys | 展开的行，控制属性 | array | - |
| rowClassName | 获取行的classname | Function(record, index, indent):string | () => '' |
| expandedRowClassName | 获取展开行的className | Function(recode, index, indent):string | () => '' |

2
package.json
View File

@ -1,6 +1,6 @@
{
"name": "bee-table",
"version": "2.2.44",
"version": "2.2.45",
"description": "Table ui component for react",
"keywords": [
"react",

3
src/lib/bigData.js
View File

@ -132,7 +132,8 @@ export default function bigData(Table) {
dataCopy = treeData;
if(Array.isArray(dataCopy)){
for (let i=0, l=dataCopy.length; i<l; i++) {
let { key, children, ...props } = dataCopy[i],
let { children, ...props } = dataCopy[i],
key = this.getRowKey(dataCopy[i],i),//bugfix生成key字段，否则树无法展开
dataCopyI = new Object(),
_isLeaf = (children && children.length > 0) ? false : true,
//如果父节点是收起状态，则子节点的展开状态无意义。（一级节点或根节点直接判断自身状态即可）