refactor(tree): 树形组件重构优化暂存

This commit is contained in:
落小梅 2021-10-18 19:10:02 +08:00
parent 520ac36d24
commit 44a19891c8
3 changed files with 31 additions and 22 deletions

View File

@ -119,7 +119,7 @@ export default {
:::
| Name | Description | Accepted Values |
| ------- | -------- | -------------- |
| ----------- | ----------- | --------------- |
| v-model | 当前激活 | -- |
| type | 主题样式 | -- |
| allow-close | 允许关闭 | `true` `false` |
@ -129,6 +129,6 @@ export default {
:::
| Name | Description | Accepted Params |
| -------- | ---- | ----------------------- |
| ------ | ----------- | --------------- |
| change | 选中切换 | -- |
| close | 关闭事件 | -- |

View File

@ -68,11 +68,17 @@ const nodeIconType = (node: TreeData): string => {
return 'layui-icon-file'
}
function handleNodeClick (args: { label: string, value: string }, node: TreeData) {
function handleNodeClick(
args: { label: string; value: string },
node: TreeData
) {
emit('node-click', args, node)
}
function recursiveNodeClick (args: { label: string, value: string }, node: TreeData) {
function recursiveNodeClick(
args: { label: string; value: string },
node: TreeData
) {
emit('node-click', args, node)
}
@ -80,7 +86,9 @@ function setChildrenChecked (checked: boolean, nodes: TreeData[]) {
const len = nodes.length
for (let i = 0; i < len; i++) {
nodes[i].isChecked.value = checked
nodes[i].children && nodes[i].children.length > 0 && (setChildrenChecked(checked, nodes[i].children))
nodes[i].children &&
nodes[i].children.length > 0 &&
setChildrenChecked(checked, nodes[i].children)
}
}
@ -90,7 +98,7 @@ function setParentChecked (checked: boolean, parent: TreeData) {
}
parent.isChecked.value = checked
const pChild = parent.children
const pChildChecked = pChild.some(c => c.isChecked.value)
const pChildChecked = pChild.some((c) => c.isChecked.value)
if (pChildChecked) {
parent.isChecked.value = true
}
@ -134,17 +142,18 @@ function handleIconClick (node: TreeData) {
{ 'layui-tree-iconClick': true },
]"
>
<LayIcon
:type="nodeIconType(node)"
@click="handleIconClick(node)"
/>
<LayIcon :type="nodeIconType(node)" @click="handleIconClick(node)" />
</span>
<LayCheckbox
v-if="showCheckbox"
v-model:checked="node.isChecked.value"
:disabled="node.isDisabled.value"
skin="primary"
@change="({ checked }) => { handleChange(checked, node) }"
@change="
({ checked }) => {
handleChange(checked, node)
}
"
>
</LayCheckbox>
<span

View File

@ -57,7 +57,7 @@ function getNode(
const parent = nodeMap.get(parentKey)
if (parent) {
console.log(parent.isChecked.value);
console.log(parent.isChecked.value)
}
// console.log((parent && parent.isChecked.value) || checkedKeys.includes(nodeKey))