vue 模板引用

虽然 Vue 的声明性渲染模型为你抽象了大部分对 DOM 的直接操作，但在某些情况下，我们仍然需要直接访问底层 DOM 元素。要实现这一点，我们可以使用特殊的 ref attribute，挂载结束后引用都会被暴露在 tis.$res 之上。

<template>
  <div ref="continer">容器 </div>
    <input type="text" ref="getText"><br>
    <button @click="getInputText">获取数据</button>
</template>

<script>
export default{
  data(){
    return{

    }
  },
  methods:{
    getInputText(){
      console.log(this.$refs.continer);
      console.log(this.$refs.getText.value);
    }
  }
}
</script>