Vue3获取v-if中的ref

在v-if中当为false时，此时dom未被渲染,无法获取到该元素

<div ref="myref" v-if="flag">div>

setup(){
const flag = ref(false)
const myref = ref(null)
console.log(myref.value)//null
	return {
		flag,
		myref
	}
}

将变量改为true,在nextTick中就能拿到了

<div ref="myref" v-if="flag">div>

setup(){
const flag = ref(false)
const myref = ref(null)
flag.value = true
nextTick(()=>{
      console.log(myref.value)//

})
	return {
		flag,
		myref
	}
}

在element-plus中，Dialog也是使用的v-if，获取Dialog中的ref时 ,ref以回调的方式赋值
注意@open之后的事件中dom才被渲染，这里我在@close中获取

<el-dialog @close="resetform()">
	<el-form
	   :ref="(el)=>userformref = el"
	>el-form>
el-dialog>

function resetform(){
    userformref.value.clearValidate()
}