<template> <button @click="focusInput">Click me to focus on the input</button> <input ref="inputField" type="text"> </template> <script setup> const focusInput = () => { this.$refs.inputField.focus(); }; </script>Estoy tratando de establecer el foco en el campo de entrada al hacer clic en un botón, pero no funciona con Vue 3. Realmente agradezco si alguien puede ayudar. Gracias
Intente seguir el siguiente fragmento ( this es algo más en la configuración del script, y no puede usar $refs ):
<script setup> import { ref } from 'vue' const inputField = ref() const focusInput = () => { inputField.value.focus(); }; </script> const { ref } = Vue const app = Vue.createApp({ setup() { const inputField = ref() const focusInput = () => { inputField.value.focus() } return { focusInput, inputField } }, }) app.mount('#demo') <script src="https://unpkg.com/vue@3/dist/vue.global.prod.js"></script> <div id="demo"> <button @click="focusInput">Click me to focus on the input</button> <input ref="inputField" type="text"> </div>