vue中获取节点的两种方法，vue组件中通过mounted和操作dom获取节点操作的方法

在使用VUE时，不能直接对节点直接进行操作，所以可能大家需要操作dom获取节点或者通过mounted来对节点进行操作，那么陌涛给大家带来下面两个方法讲解

第一种：通过选择器来获取

template中代码

<template>
  <div>
    <canvas id='top' >
  </div>
</template>

js代码

<script>
    export default{
        mounted(){
            let top = document.querySelector("#top");
        }
    }
</script>

之前，我们使用document.getElementById来获取id，在VUE中，我们需要使用 document.querySelector 来获取。

第二种：使用ref获取

template中代码

<template>
  <div>
    <canvas ref='top' >
  </div>
</template>

js代码

<script>
    export default{
        mounted(){
           let canvas=this.$refs.top;
        }
    }
</script>