Vue.js中＜input ref=“input“＞

在Vue.js中，ref是一个特殊的属性，用于注册一个引用信息。这个引用信息可以用来直接访问DOM元素或子组件实例。

对于<input ref="input">，这里我们通过ref属性将该<input>元素注册为名为"input"的引用。之后，在Vue实例或组件的方法中，你可以使用this.$refs.input来直接访问这个<input>元素。

以下是一个简单的例子，演示了如何使用ref来访问<input>元素：

<template>  
  <div>  
    <input ref="input" placeholder="输入内容">  
    <button @click="focusOnInput">聚焦输入框</button>  
  </div>  
</template>  
  
<script>  
export default {  
  methods: {  
    focusOnInput() {  
      // 使用 this.$refs.input 来访问 <input> 元素  
      this.$refs.input.focus();  
    }  
  }  
}  
</script>

在上面的例子中，当点击"聚焦输入框"按钮时，会触发focusOnInput方法。这个方法通过this.$refs.input来访问<input>元素，并调用其focus()方法，使输入框获得焦点。

需要注意的是，$refs只会在组件渲染完成后被填充，并且它是非响应式的。因此，不应该在模板或计算属性中使用$refs。