vue项目实战（七）：ref标签获取原生Dom对象或组件对象

1-Dom元素绑定标签ref

我们使用以下代码获取组件App中定义的Dom对象，可以看到一共分成了两步

1. 给Dom对象绑定ref属性，给其一个名字。
2. 在需要调用的函数中使用this.$refs访问所有该组件绑定了ref的Dom元素，其中ref属性的明明可以作为key值，使用this.$refs.name即可访问原生的Dom对象。

tips
需要注意refs绑定的名称时可以重复的，但是一旦重复，后绑定的元素会覆盖掉之前绑定的元素。所以一般尽量不要重名。

      Vue.component("App", {
        template:`
          <div class="app">
            <button ref='btn'>我是按钮1</button>
          </div>
        `,
        mounted(){
          console.log(this.$refs.btn);
        }
      }),
      new Vue({
        el:"#app",
        data(){
          return{

          }
        },
        template:'<App/>'
      })

2-组件对象绑定ref标签。