Vue2和Vue3中获取元素

• Vue2中获取元素

  • 一个例子

    <template>
      <div ref="myRef"></div>
    </template>
    
    <script>
      export default{
        mounted(){
          console.log(this.$refs.myRef)
        }
      }
    </script>
    

    ref只有在mounted之后才能获取到。

• Vue3中获取元素

  • 一个例子

    <template>
      <div ref="myRef"></div>
    </template>
    
    <script>
    export defineComponent({
        setup(){
          const myRef = ref<HTMLDivElement>()
          onMounted(() => {
            console.log(myRef.value)
          })
          return{
            myRef,
          }
        }
      })
    </script>
    

    ref既可用于声明响应式数据，也可以用于获取元素。