当我们要在网页刷新时，自动获取输入框的焦点，需要使用到mounted钩子。
mounted()是Vue组件生命周期钩子函数之一，它会在Vue实例挂载到DOM后被调用。在mounted()钩子函数中，你可以执行一些初始化的操作、访问DOM元素、进行数据请求等。
在Vue中获取输入框焦点可以使用ref属性和$refs对象。
下面是一个例子
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=
, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="app">
密码：<input type="password" v-model="password" ref="inp">
</div>
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
<script>
const app = new Vue({
el:'#app',
data:{
password:''
},
mounted(){
this.$refs.inp.focus()
}
})
</script>
</body>
</html>在这个示例中，我们使用了ref属性来标识输入框元素，并赋予它一个名字"inp"。然后，在focusInput方法中，我们通过this.$refs.inp访问到输入框元素的DOM实例，并调用其focus()方法来设置焦点。
mounted()钩子函数被定义在Vue组件的选项中。当该组件被挂载到DOM后，mounted()函数将被自动调用，从而将焦点设置到输入框中。
在mounted()函数中，我们可以访问组件的数据、方法和DOM元素。并通过ref和$refs的结合使用，我们可以方便地在Vue中获取和操作DOM元素，包括设置焦点。
下面是运行效果
刷新网页时输入框会自动获取焦点
2万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
