父组件调用子组件中的函数
时间: 2023-11-19 17:50:35 浏览: 63
vue 父组件中调用子组件函数的方法
5星 · 资源好评率100%
要在父组件中调用子组件的函数,可以通过 `ref` 属性获取子组件实例,然后直接调用其方法。具体步骤如下:
1. 在子组件中定义一个方法,例如 `childMethod`。
2. 在父组件中使用 `ref` 属性获取子组件实例,例如 `this.$refs.child`。
3. 直接调用子组件的方法,例如 `this.$refs.child.childMethod()`。
以下是一个示例代码:
```html
<template>
<div>
<ChildComponent ref="child"></ChildComponent>
<button @click="callChildMethod">调用子组件方法</button>
</div>
</template>
<script>
import ChildComponent from './ChildComponent.vue'
export default {
components: {
ChildComponent
},
methods: {
callChildMethod() {
this.$refs.child.childMethod()
}
}
}
</script>
```
阅读全文