UTree value-key not working

[alex-eri]

Environment

---

• Operating System: Linux
• Node Version: v22.14.0
• Nuxt Version: 3.16.1
• CLI Version: 3.23.1
• Nitro Version: 2.11.8
• Package Manager: [email protected]
• Builder: -
• User Config: compatibilityDate, devtools, nitro, css, modules, vite
• Runtime Modules: @nuxt/[email protected], @nuxt/[email protected], @nuxt/[email protected], @nuxt/[email protected], @nuxt/[email protected], @nuxt/[email protected], @nuxt/[email protected]
• Build Modules: -

---

Is this bug related to Nuxt or Vue?

Nuxt

Version

v3.0.2

Reproduction

<template>
  <div class="flex flex-col items-center justify-center gap-4 h-screen">

    {{ state }}

    <div class="flex items-center gap-2">
      <UTree
        :items="gates"
        label-key="label"
        value-key="id"
        v-model="state.gate" 
      >
      </UTree>
    </div>
  </div>
</template>



<script
  lang="ts"
  setup
>

import type { FormSubmitEvent } from '@nuxt/ui'

interface Gate {
  id: number,
  label: string,
  uname: string
}

type Schema = {
  gate: Gate
}

const state = reactive<Partial<Schema>>({
  gate: undefined,
})

const gates = [{id:0, uname: null, label: "unknown"}, {id:1, uname: "first-gate", label: "First"}]

</script>

Description

value-key points to id or missed.

v-model type check points to id:number but there is full object.

Additional context

How to get full object here when bug fixed?

Logs