mirror of https://github.com/ElemeFE/element
Tree: add setChecked method. (#1434)
parent
2e79e4af63
commit
d3b3d865e8
|
@ -247,6 +247,7 @@ Used for node selection. In the following example, data for each layer is acquir
|
||||||
| setCheckedNodes | set certain nodes to be checked, only works when `node-key` is assigned | an array of nodes to be checked |
|
| setCheckedNodes | set certain nodes to be checked, only works when `node-key` is assigned | an array of nodes to be checked |
|
||||||
| getCheckedKeys | If the node can be selected (`show-checkbox` is `true`), it returns the currently selected array of node's keys | (leafOnly) Accept a boolean type parameter whose default value is `true`. <br>If the parameter is `true`, it only returns the currently selected array of sub-nodes.|
|
| getCheckedKeys | If the node can be selected (`show-checkbox` is `true`), it returns the currently selected array of node's keys | (leafOnly) Accept a boolean type parameter whose default value is `true`. <br>If the parameter is `true`, it only returns the currently selected array of sub-nodes.|
|
||||||
| setCheckedKeys | set certain nodes to be checked, only works when `node-key` is assigned | (keys, leafOnly) Accept two parameters: 1. an array of node's keys to be checked 2. a boolean type parameter whose default value is `true`. <br>If the parameter is `true`, it only returns the currently selected array of sub-nodes. |
|
| setCheckedKeys | set certain nodes to be checked, only works when `node-key` is assigned | (keys, leafOnly) Accept two parameters: 1. an array of node's keys to be checked 2. a boolean type parameter whose default value is `true`. <br>If the parameter is `true`, it only returns the currently selected array of sub-nodes. |
|
||||||
|
| setChecked | set node to be checked or not, only works when `node-key` is assigned | (key/data, checked, deep) Accept three parameters: 1. node's key or data to be checked 2. a boolean typed parameter indicating checked or not. 3. a boolean typed parameter indicating deep or not. |
|
||||||
|
|
||||||
### Events
|
### Events
|
||||||
| Event Name | Description | Parameters |
|
| Event Name | Description | Parameters |
|
||||||
|
|
|
@ -259,6 +259,7 @@
|
||||||
| setCheckedNodes | 设置目前勾选的节点,使用此方法必须设置 node-key 属性 | (nodes) 接收勾选节点数据的数组 |
|
| setCheckedNodes | 设置目前勾选的节点,使用此方法必须设置 node-key 属性 | (nodes) 接收勾选节点数据的数组 |
|
||||||
| getCheckedKeys | 若节点可被选择(即 `show-checkbox` 为 `true`),<br>则返回目前被选中的节点所组成的数组 | (leafOnly) 接收一个 boolean 类型的参数,若为 `true` 则仅返回被选中的叶子节点的 keys,默认值为 `true` |
|
| getCheckedKeys | 若节点可被选择(即 `show-checkbox` 为 `true`),<br>则返回目前被选中的节点所组成的数组 | (leafOnly) 接收一个 boolean 类型的参数,若为 `true` 则仅返回被选中的叶子节点的 keys,默认值为 `true` |
|
||||||
| setCheckedKeys | 通过 keys 设置目前勾选的节点,使用此方法必须设置 node-key 属性 | (keys, leafOnly) 接收两个参数,1. 勾选节点的 key 的数组 2. boolean 类型的参数,<br>若为 `true` 则仅设置叶子节点的选中状态,默认值为 `true` |
|
| setCheckedKeys | 通过 keys 设置目前勾选的节点,使用此方法必须设置 node-key 属性 | (keys, leafOnly) 接收两个参数,1. 勾选节点的 key 的数组 2. boolean 类型的参数,<br>若为 `true` 则仅设置叶子节点的选中状态,默认值为 `true` |
|
||||||
|
| setChecked | 通过 key / data 设置某个节点的勾选状态,使用此方法必须设置 node-key 属性 | (key/data, checked, deep) 接收三个参数,1. 勾选节点的 key 或者 data 2. boolean 类型,节点是否选中 <br> 3. boolean 类型,是否设置子节点 ,默认为 false |
|
||||||
|
|
||||||
### Events
|
### Events
|
||||||
| 事件名称 | 说明 | 回调参数 |
|
| 事件名称 | 说明 | 回调参数 |
|
||||||
|
|
|
@ -225,4 +225,12 @@ export default class TreeStore {
|
||||||
if (node) node.expand(null, this.autoExpandParent);
|
if (node) node.expand(null, this.autoExpandParent);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
setChecked(data, checked, deep) {
|
||||||
|
const node = this.getNode(data);
|
||||||
|
|
||||||
|
if (node) {
|
||||||
|
node.setChecked(!!checked, deep);
|
||||||
|
}
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
|
@ -40,7 +40,7 @@
|
||||||
|
|
||||||
<script type="text/jsx">
|
<script type="text/jsx">
|
||||||
import CollapseTransition from './transition';
|
import CollapseTransition from './transition';
|
||||||
import ElCheckbox from 'element-ui/packages/checkbox'
|
import ElCheckbox from 'element-ui/packages/checkbox';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'el-tree-node',
|
name: 'el-tree-node',
|
||||||
|
|
|
@ -144,6 +144,9 @@
|
||||||
setCheckedKeys(keys, leafOnly) {
|
setCheckedKeys(keys, leafOnly) {
|
||||||
if (!this.nodeKey) throw new Error('[Tree] nodeKey is required in setCheckedNodes');
|
if (!this.nodeKey) throw new Error('[Tree] nodeKey is required in setCheckedNodes');
|
||||||
this.store.setCheckedKeys(keys, leafOnly);
|
this.store.setCheckedKeys(keys, leafOnly);
|
||||||
|
},
|
||||||
|
setChecked(data, checked, deep) {
|
||||||
|
this.store.setChecked(data, checked, deep);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
|
@ -238,6 +238,18 @@ describe('Tree', () => {
|
||||||
expect(tree.getCheckedKeys().length).to.equal(3);
|
expect(tree.getCheckedKeys().length).to.equal(3);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('method setChecked', () => {
|
||||||
|
vm = getTreeVm(':props="defaultProps" show-checkbox node-key="id"');
|
||||||
|
const tree = vm.$children[0];
|
||||||
|
tree.setChecked(111, true, true);
|
||||||
|
expect(tree.getCheckedNodes().length).to.equal(3);
|
||||||
|
expect(tree.getCheckedKeys().length).to.equal(3);
|
||||||
|
|
||||||
|
tree.setChecked(vm.data[0], false, true);
|
||||||
|
expect(tree.getCheckedNodes().length).to.equal(0);
|
||||||
|
expect(tree.getCheckedKeys().length).to.equal(0);
|
||||||
|
});
|
||||||
|
|
||||||
it('setCheckedKeys with leafOnly=false', () => {
|
it('setCheckedKeys with leafOnly=false', () => {
|
||||||
vm = getTreeVm(':props="defaultProps" show-checkbox node-key="id"');
|
vm = getTreeVm(':props="defaultProps" show-checkbox node-key="id"');
|
||||||
const tree = vm.$children[0];
|
const tree = vm.$children[0];
|
||||||
|
|
Loading…
Reference in New Issue