Vue 使用ref获取节点

使用ref获取节点

  <div class="innercontainer" ref="dropdownRef"></div>

在vue3中不能直接获取

首先，需要在setup()中进行定义，并返回

setup(){
	const dropdownRef = ref<null | HTMLElement>(null)
    return {
        dropdownRef
    }
}

注意：在定义的时候将dropdownRef定义成一个null和HTMLElement

原因：在未挂载之前，HTML代码还未加载完成，dropdownRef变量就是一个null，当挂载完毕之后，那么dropdownRef就是一个节点了

那么在使用Ref进行编写函数的时候，需要先对dropdownRef进行判断

使用dropdownRef.value就能获取到这个节点了