-
Notifications
You must be signed in to change notification settings - Fork 1.6k
Open
Labels
Status: Needs TriageIssue will be reviewed by Core Team and a relevant label will be added as soon as possibleIssue will be reviewed by Core Team and a relevant label will be added as soon as possible
Description
Describe the bug
There is an issue when moving a node from inside of one parent and placing it inside another parent.
If the target parent has one child, no matter if you put the node above or below this child, the event will always produce index: 0.
Use repro steps given this example below:
<template>
<Tree
v-model:value="categoriesDynamic"
v-model:selectionKeys="selectedKey"
class="w-full"
draggable-nodes
droppable-nodes
selection-mode="single"
@node-drop="onNodeDrop"
>
</Tree>
</template>
<script setup>
let categoriesDynamic = ref([
{
key: '0',
label: 'Documents',
data: 'Documents Folder',
icon: 'pi pi-fw pi-inbox',
children: [
{ key: '0-0', label: 'Expenses.doc', icon: 'pi pi-fw pi-file', data: 'Expenses Document' },
{ key: '0-1', label: 'Resume.doc', icon: 'pi pi-fw pi-file', data: 'Resume Document' }
]
},
{
key: '1',
label: 'Events',
data: 'Events Folder',
icon: 'pi pi-fw pi-calendar',
children: [
{ key: '1-0', label: 'Meeting', icon: 'pi pi-fw pi-calendar-plus', data: 'Meeting' },
]
}
]);
function onNodeDrop(event) {
console.log('Node dropped', event);
}
</script>
Full screenshot with debug log of all steps:
Pull Request Link
No response
Reason for not contributing a PR
- Lack of time
- Unsure how to implement the fix/feature
- Difficulty understanding the codebase
- Other
Other Reason
No response
Reproducer
https://stackblitz.com/edit/uefh5gmh-fzmyi1tf?file=src%2FApp.vue
Environment
Running local devstack on Fedora 42. Devstack is in webdevops/php-nginx-dev:8.4 container. App is running Laravel 12 on BE with Inertia.js. Primevue components are autoimported using auto-import-resolver.
Vue version
3.3.13
PrimeVue version
4.4.1
Node version
v22.20.0
Browser(s)
Vivaldi 7.6.3797.63
Steps to reproduce the behavior
- Drag the
Expenses.docnode fromDocuments - Drop it inside
Eventsabove theMeetingnode- This produces dragNode: Expenses.doc, dropNode: Meeting, index: 0
- Now put the
Expenses.docnode back intoDocumentsparent to original place - Drag the
Expenses.docagain - Put it inside
EventsBELOW theMeetingnode (so that theExpenses.docis last child inside Events)- This produces the same result: dragNode: Expenses.doc, dropNode: Meeting, index: 0
- This way we can't tell, if the node went above or below the other child.
Expected behavior
The index value should be correct based on the position relative to the other child in the parent.
Metadata
Metadata
Assignees
Labels
Status: Needs TriageIssue will be reviewed by Core Team and a relevant label will be added as soon as possibleIssue will be reviewed by Core Team and a relevant label will be added as soon as possible