时间戳

首页 > 解决方案 > 孩子到父母到另一个孩子之间的Vue通信

javascript - 孩子到父母到另一个孩子之间的Vue通信

问题描述

我有一个<payment-child-component>处理所有订阅和付款的，我也有

其他<check-active-child-component>

我希望这两个组件进行通信。persay 在<payment-component>用户取消他的订阅我想触发我有一个方法，<check-active-component>其中调用checkActive()

所以从payment-component发出到parent-component订阅取消方法被触发然后触发checkActive()里面的方法check-active-component

因此，如果我的逻辑是好的，那么确切的问题是：我如何从父组件触发方法到子组件？

标签： javascriptvue.js

解决方案

要从父组件调用子组件的方法，可以使用ref. 这是一个例子：

子组件：

export default {
  name: "ChildComponent",
  methods: {
    childMethod(){
      console.log("hello from child");
    }
  }
};

父组件：

<template>
  <div id="app">
    <ChildComponent ref="myChild"/>
  </div>
</template>

<script>
import ChildComponent from "./components/ChildComponent";

export default {
  name: "App",
  components: {
    ChildComponent
  },
  mounted(){
    this.$refs.myChild.childMethod()
  }
};
</script>

推荐阅读