Skip to content

fix: issue #109 #110

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
Dec 5, 2024
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 15 additions & 3 deletions src/components/Tree.vue
Original file line number Diff line number Diff line change
@@ -220,10 +220,10 @@ export interface TreeProps {

/** 渲染节点数量,可见节点数大于此值且高度超过(容器可视高度能容纳节点数 + bufferNodeAmount)则不会渲染所有可见节点 */
renderNodeAmount?: number,

/** 根据节点最小高度计算数据总高度 */
nodeMinHeight?: number,

/** 当滚动到视野外的节点个数大于此值时刷新渲染节点 */
bufferNodeAmount?: number,
}
@@ -288,6 +288,7 @@ import { usePublicTreeAPI } from '../hooks/usePublicTreeAPI'
import { FilterFunctionType } from '../store/tree-store'
import { pickReadonly } from '../utils'
import { useExpandAnimation } from '../hooks/useExpandAnimation'
import {ArgumentsType} from "vitest";

const props = withDefaults(defineProps<TreeProps>(), DEFAULT_TREE_PROPS)

@@ -677,6 +678,17 @@ const treeNodePropKeys = [

const treeNodeProps = reactive(pickReadonly(toRefs(props), ...treeNodePropKeys))

const setExpandExpose = (...args: ArgumentsType<typeof setExpand>) => {
if (props.animation) {
const node = getNode(args[0]);
if(node) {
expandAnimation.updateBeforeExpand(node)
}
}

setExpand(...args)
}

defineExpose({
setData,
setChecked,
@@ -685,7 +697,7 @@ defineExpose({
clearChecked,
setSelected,
clearSelected,
setExpand,
setExpand: setExpandExpose,
setExpandKeys,
setExpandAll,
getCheckedNodes,
6 changes: 3 additions & 3 deletions src/hooks/usePublicTreeAPI.ts
Original file line number Diff line number Diff line change
@@ -5,7 +5,7 @@ import { ITreeNodeOptions } from "../store/tree-node"
import { FilterFunctionType } from "../store/tree-store"
import { TreeProps } from "../components/Tree.vue"

type IUsePublicTreeAPIProps = Required<Pick<TreeProps,
type IUsePublicTreeAPIProps = Required<Pick<TreeProps,
'selectable' |
'checkable' |
'separator' |
@@ -82,8 +82,8 @@ export const usePublicTreeAPI = (
key: TreeNodeKeyType,
value: boolean,
expandParent: boolean = true
): void {
nonReactive.store.setExpand(key, value, expandParent)
): Promise<void> {
return nonReactive.store.setExpand(key, value, expandParent)
}
function setExpandKeys(keys: TreeNodeKeyType[], value: boolean): void {
nonReactive.store.setExpandKeys(keys, value)
20 changes: 11 additions & 9 deletions src/store/tree-store.ts
Original file line number Diff line number Diff line change
@@ -366,13 +366,13 @@ export default class TreeStore extends TreeEventTarget {
* @param triggerEvent 是否触发事件
* @param triggerDataChange 是否触发 `data-change` 事件以通知外部刷新视图
*/
setExpand(
async setExpand(
key: TreeNodeKeyType,
value: boolean,
expandParent: boolean = false,
triggerEvent: boolean = true,
triggerDataChange: boolean = true
): void {
): Promise<void> {
const node = this.mapData[key]
if (!node || (!expandParent && node.isLeaf)) return

@@ -386,7 +386,7 @@ export default class TreeStore extends TreeEventTarget {
if (triggerDataChange) {
this.emit('visible-data-change')
}
new Promise((resolve, reject) => {
await new Promise((resolve, reject) => {
const load = this.options.load as Function
load(node, resolve, reject)
})
@@ -446,7 +446,7 @@ export default class TreeStore extends TreeEventTarget {
}

if (expandParent && node._parent && value) {
this.setExpand(
await this.setExpand(
node._parent[this.options.keyField],
value,
expandParent,
@@ -461,14 +461,15 @@ export default class TreeStore extends TreeEventTarget {
* @param keys 展开的节点 key 数组
* @param value 是否展开
*/
setExpandKeys(
async setExpandKeys(
keys: TreeNodeKeyType[],
value: boolean,
triggerDataChange: boolean = true
): void {
keys.forEach(key => {
this.setExpand(key, value, false, false, false)
})
): Promise<void> {

for (const key of keys) {
await this.setExpand(key, value, false, false, false)
}

if (triggerDataChange) {
this.emit('visible-data-change')
@@ -1271,6 +1272,7 @@ export default class TreeStore extends TreeEventTarget {
* @param node 需要勾选的节点
*/
private checkParentNode(node: TreeNode): void {
if(!this.options.cascade) return
const length = node.children.length
if (!length) return
let hasChecked = false