$ref和$el的区别

<template>

    <div>
        <!--组件textCompont-->
        <textCompont ref='textCompontRef' />

        <!--元素div-->
        <div ref='divCompontRef' />
    </div>

</template>

  mounted() {
    console.log(this.$refs.textCompontRef, '组件ref'); // 获取组件实例
    console.log(this.$refs.textCompontRef.$el, '组件el'); // 获取组件实例的dom元素
    console.log(this.$refs.divCompontRef, '元素ref'); // 获取dom元素
    console.log(this.$refs.divCompontRef.$el, '元素el'); // $el用于vue组件，普通dom元素不能用
  },