#Focus UInput

6 messages · Page 1 of 1 (latest)

wanton atlasBOT
#

Hi @mighty flint. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

#

UInput is not mentioned in the provided Nuxt knowledge sources, and there’s no example of focusing it programmatically (e.g. via input.value.inputRef.focus()), so I can’t say exactly why your code isn’t working based on these documents.

The only related information is that, starting from Vue 3.5, the recommended way to reference DOM elements or components is useTemplateRef, not classic ref bindings. [useTemplateRef PR]

If UInput exposes an internal inputRef (similar to the Vuetify ref="inputRef" example), you’d typically:

<script setup>
const input = useTemplateRef('input') // or ref(null) in earlier Vue
// later: input.value?.focus()
</script>

<template>
  <UInput ref="input" />
</template>

But since there is no documentation about UInput or its inputRef in the provided sources, I cannot confirm the correct property or method to call. You’ll need to check that component’s own docs or source to see:

  • what ref it exposes, and
  • whether focus() should be called on the component instance, or on a nested element like inputRef.

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@mighty flint Kapa.ai is still learning and improving, please let me know how I did by reacting below.

mighty flint
#

@wanton atlas i have ref="input" on my UInput, but the focus did nothing

#

@wanton atlas

wanton atlasBOT
#

Let me check the knowledge base for you again. One moment! :books: