vue中父组件调用子组件里的方法

vue的子组件 Child 中定义了一个方法 childFn() ，现在想要在父组件 Parent 中调用这个方法，代码如下：

子组件：

<tenmplate>
  <div class="child">
    ...
  </div>
</template>

<scrtipt>
export default {
  methods: {
    childFn() {
      console.log('我是子组件的方法');
    }
  }
}
</script>

父组件：

<tenmplate>
  <div class="parent">
    <v-child ref="child"></v-child>
  </div>
</template>

<scrtipt>
import Child from './Child/Child.vue';

export default {
  components: {
    [
      'v-child': Child
    ]
  },
  methods: {
    parentFn() {
      this.$refs.child.childFn(); // 调用子组件的childFn()方法
    }
  }
}
</script>

（注意：子组件不能调用父组件的方法）

©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容