vue3<script setup>语法糖中父组件调用子组件方法
// 父组件<template><child ref="childRef"></child></template><script setup>import { ref } from "vue";// 引入子组件import child from "./child.vue";// 获取子组件const childRef = ref(null
·
// 父组件
<template>
<child ref="childRef"></child>
</template>
<script setup>
import { ref } from "vue";
// 引入子组件
import child from "./child.vue";
// 获取子组件
const childRef = ref(null);
const fun = () => {
childRef.value.childFun();// 调用子组件的方法
}
</script >
// 子组件
<script setup>
import { defineExpose } from 'vue'
const childFun = () => {
console.log('我是子组件方法')
}
// 重点!!这里需要使用defineExpose暴露出去
defineExpose({
childFun
})
</script>
这里主要是用到defineExpose
将属性从子组件暴露出去,文档中其实有,但是很不好找,文档中是这样写的:
更多推荐
已为社区贡献2条内容
所有评论(0)