vue2 父组件调用子组件的方法
时间: 2023-11-03 17:17:38 浏览: 84
vue 父组件中调用子组件函数的方法
5星 · 资源好评率100%
可以通过在父组件中使用 `$refs` 来获取子组件的实例,然后直接调用子组件中的方法。示例代码如下:
```html
<template>
<div>
<my-child ref="child"></my-child>
<button @click="callChildMethod">调用子组件方法</button>
</div>
</template>
<script>
import MyChild from './MyChild.vue'
export default {
components: {
MyChild
},
methods: {
callChildMethod() {
this.$refs.child.childMethod()
}
}
}
</script>
```
其中,`MyChild.vue` 是子组件的代码,`childMethod` 是子组件中的方法名。在父组件中,我们先在 `my-child` 组件上添加了一个 `ref` 属性,值为 `child`,然后在 `callChildMethod` 方法中通过 `$refs` 获取到了子组件的实例,最后直接调用了 `childMethod` 方法。
阅读全文