项目场景：

vue父页面调用子页面及方法

问题描述

vue中父界面调用子界面及方法时界面可以调用，但是调用方法的时候第一次报错，但是关掉界面再次重新打开就没问题了

原因分析：

在我之前添加鼠标指针定位的时候，如果在当前页面可以直接定位，但是如果在el-dialog弹出框里展示定位鼠标光标的话就会实现不了，原因是需要设置setTimeout(() => { }, 200) 延迟因为我直接找的解决方案所以原因没有过于去看，但是我分析应该是方法执行的太快，在界面打开之前就已经获取了，但是界面没打开所以无法获取位置，导致方法失败，于是我加在了调用子界面方法上解决了

解决方案：

1.首先是将子界面引入到父界面然后使用components自定义组件

（1） import CardRecharge from "../xxxxx/xxxxx.vue";

（2） components: {
CardRecharge,
},

2.，调用子界面的代码,

<el-dialog title="患者信息" v-model="patInfDialogVisible" width="80%" >
           <CardRecharge ref="pFication" :CARD_NO="select_Bed_Ary.CARD_NO"></CardRecharge>
           <template #footer >
               <span class="dialog-footer" style="align-items: ;">
                   <el-button size="default" type="success" @click="pFicationOnSave" >确认</el-button>
                   <el-button size="default" @click="patInfDialogVisible = false">取消</el-button>
               </span>
           </template>
       </el-dialog>

3.这里是给子界面传入选择数据字段，需要配合第一步的:CARD_NO="select_Bed_Ary.CARD_NO"使用，这个是方法传参，也可以将数据放到缓存中传参

const handleClick = function(row, event, column) {

_this.select_Bed_Ary.CARD_NO=row.CARD_NO,}

4.这里是调用子界面的方法

	const pFication =ref(null);
			const pFicationOnSave = function(){
				
				setTimeout(() => {
					_this.patInfDialogVisible=false;
					_this.getCardDate();
				}, 200)
			}
			const onAvatar=function(item,state){
				if(state == '1'){
					 _this.select_Bed_Ary=item;
					pFication.value.getEssentialInform()
					_this.patInfDialogVisible=true;
					pFication.value.ClearScreen()
				}else{
					_this.patInfDialogVisible=true;
//这里就是添加了延时调用自界面方法
					setTimeout(() => {
						pFication.value.getEssentialInform() 
					}, 200)
					
				}
			};

5.以上是父级界面代码。

子界面代码

1.使用props传值这个介绍可以看这个连接

vue中组件的props属性（详）_suoh's Blog的博客-CSDN博客_vue props

将父界面值传过来加到调用的方法作为传递的参数

然后使用语法糖暴露一下子页面的方法让父界面调用

   // 父组件调用子组件时的方法暴漏
           defineExpose(()=>{
               getEssentialInform,
               ClearScreen,
               Recharge
           });

以上就是vue3父界面调用子界面，传参的方法和遇到的问题的解决方案，只总结个人情况，解决参考

附加鼠标光标定位：