VUE this.$el如何获取某一个节点

如果你想获取当前组件实例中的某一个具体的 DOM 元素节点，可以使用原生的 DOM API 或者 Vue 提供的 $refs 来获取。

1. 使用原生的 DOM API

在组件中使用原生的 DOM API 来获取某一个具体的 DOM 元素节点，可以使用 this.$el.querySelector() 或者 this.$el.querySelectorAll() 方法。例如：

<template>
  <div>
    <span ref="span">Hello World!</span>
  </div>
</template>

<script>
export default {
  mounted() {
    console.log(this.$el.querySelector('span')); // 获取 <span> 元素节点
  }
}
</script>

在上面的代码中，我们在组件中使用了一个 ref 属性来标记一个 span 元素，然后在 mounted 钩子函数中使用 this.$el.querySelector('span') 方法获取该元素节点。

2. 使用 Vue 提供的 $refs

在组件中使用 Vue 提供的 $refs 来获取某一个具体的 DOM 元素节点，可以在模板中使用 ref 属性来标记需要获取的元素，然后在组件中通过 this.$refs.xxx 来获取该元素。例如：

<template>
  <div>
    <span ref="span">Hello World!</span>
  </div>
</template>

<script>
export default {
  mounted() {
    console.log(this.$refs.span); // 获取 <span> 元素节点
  }
}
</script>

在上面的代码中，我们在组件中使用了一个 ref 属性来标记一个 span 元素，然后在 mounted 钩子函数中使用 this.$refs.span 来获取该元素节点。