vue3 在popup中父组件无法通过ref获取子组件defineExpose的属性

全文总结（可以不看下面的分析）

问题:父组件无法通过ref获取子组件defineExpose的属性.

背景:声明和暴露都写全了,在vue3 setup代码块中，子组件有手动defineExpose暴露，并且该页面其他的子组件可以获取到ref值，就这个写在popup中的组件拿不到。

解决:在popup添加:lazyRender=“false” 的属性，让弹窗未点开时就把子组件加载好，这样ref才有值。

问题描述

能获取到ref属性值的代码如下：

1.直接<xxx></xxx>调用子组件的方式
<BPickerSearch  ref="refDeviceNum"  v-show="DeviceName.show">
</BPickerSearch >

2.在popup中的以<component></component>t形式通过is属性动态调用的方式。
<van-popup  @open="reloadPopupList" :style="ChooseUserPopup2.style" :lazyRender="ChooseUserPopup2.lazyRender" v-model:show="ChooseUserPopup2.show">
        <component :style="component5472.style" ref="chooseCheckUserRef" :pgnum=UnitOrgNum.value.value||user.personInfor.PgNum  :is="chooseCheckUser" v-show="component5472.show" @clickUser="getUserInfo">
        </component> 
</van-popup>

上面的refDeviceNum、chooseCheckUserRef都能拿到对应的属性值，也能在value中看到子组件向外暴露的方法。

ref拿到value为null的如下：

 <van-popup v-model:show="show" position="bottom"  :style="{ height: '70%' }">
        <LocationTree  ref="LocationTreeRef"   @comfirmLocpopup="comfirmLocpopup" v-show="LocationTree712.show" >
        </LocationTree>   
 </van-popup>

排查过程

1.排查了并非变量声明和暴露不规范的问题。
2.把LocationTree组件移到popup外面ref的value就有值了，以为是和不同调用子组件导致的，但是换了也不行。
3.以为是popup打开前后popup子组件未加载，所以特意把LocationTreeRef输出放在了弹窗show之后，但仍未能解决。
4.发现第三步思路是对的，解决方案错了，正确的是把popup的lazy-render设置为false，让弹窗未点开时就把子组件加载好，这样ref就有值了。

解决方案

最终代码应修改如下：

 <van-popup v-model:show="show"  position="bottom"  :style="{ height: '70%' }">
        <LocationTree  ref="LocationTreeRef" :lazyRender="false"   @comfirmLocpopup="comfirmLocpopup" v-show="LocationTree712.show" >
        </LocationTree>   
 </van-popup>