使用vue / composition从parrent调用子组件方法
提问于 2020-01-20 09:08:16
我正在尝试使用这个组合API在Vue中构建一个可重用的模态组件。我们的计划是公开一些方法，比如toggleModal()来调用父组件中的一些事件。我已经用setup()和methods编写了我的方法。
export default {
setup() {
const isModalOpen = ref(false);
const toggleModal = () => {};
return {
toggleModal,
};
},
methods: {
toggleModalMethod() {},
},
};如果我console.log()我的模态组件，我可以看到只有我的来自methods的toggleModalMethod()是公开的。
有没有办法公开一个子方法并从父组件调用它？
回答 1
Stack Overflow用户
发布于 2020-01-20 11:41:14
挂载子组件时，期望从setup返回的属性在组件实例上可用。
这是a demo
<template>
<div>
<Modal ref="modal"/>
<button @click="toggle">Toggle</button>
</div>
</template>
<script>
...
export default {
...
methods: {
toggle() {
this.$refs.modal.toggleModal();
}
}
};
</script>通过引用从父级访问子对象的成员被认为是an edge case，尽管将模式切换函数公开为公共方法是被广泛接受的场景。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/59819967
复制
腾讯云开发者
