vue之父组件访问子组件的方法

<template></template>
<script>
export default {
  methods: {
    print() {
      console.log(123);
    },
  },
};
</script>
<style>
</style>

子组件中定义了一个方法print,打印123
父组件想要调用子组件的print方法:

  • 1.使用$refs获取子组件dom,再访问dom上的方法
    父组件 father
<template>
  <div>
    <Child ref="child" />
  </div>
</template>

<script>
import Child from './child'
export default {
  components:{ Child },
  mounted(){
    this.$refs.child.print()   // ==> 123
  }
};
</script>
posted @ 2021-02-23 15:08  zoo-x  阅读(116)  评论(0编辑  收藏  举报