最近很多朋友私我请教子组件实例的获取方法
解答:
vue2中可直接通过父组件内组件的ref读取子组件的实例,vue3有些许区别
vue3中需要在子组件中导出(暴露)相关实(你需要再父组件中调用)例方法:
子组件中
const getFileList = () => {
const addFile = getAddFileList();
const delFile = getDelFileList();
return { addFile, delFile };
};
//使用此属性导出实例方法
defineExpose({
getFileList
});
父组件中
// 读取子组件实例方法
<MultiFileUpload
ref="uploadFileRef"
/>
const uploadFileRef = ref<any>();
const getFileRef = () => {
const fileData = uploadFileRef.value.getFileList();
return fileData;
};
只需以上步骤即可访问子组件实例方法。