首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >使用vue / composition从parrent调用子组件方法

使用vue / composition从parrent调用子组件方法
EN

Stack Overflow用户
提问于 2020-01-20 09:08:16
回答 1查看 3.5K关注 0票数 3

我正在尝试使用这个组合API在Vue中构建一个可重用的模态组件。我们的计划是公开一些方法,比如toggleModal()来调用父组件中的一些事件。我已经用setup()methods编写了我的方法。

代码语言:javascript
运行
AI代码解释
复制
export default {
  setup() {
      const isModalOpen = ref(false);

      const toggleModal = () => {};

      return {
          toggleModal,
      };
  },
  methods: {
      toggleModalMethod() {},
  },
};

如果我console.log()我的模态组件,我可以看到只有我的来自methodstoggleModalMethod()是公开的。

有没有办法公开一个子方法并从父组件调用它?

EN

回答 1

Stack Overflow用户

发布于 2020-01-20 11:41:14

挂载子组件时,期望从setup返回的属性在组件实例上可用。

这是a demo

代码语言:javascript
运行
AI代码解释
复制
<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,尽管将模式切换函数公开为公共方法是被广泛接受的场景。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/59819967

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档