vue父调用子组件方法
时间: 2023-09-10 11:10:35 浏览: 84
vue 父组件调用子组件方法及事件
可以通过在父组件中使用 `$refs` 访问子组件的实例,然后调用子组件的方法。
在子组件中定义一个方法:
```
methods: {
childMethod() {
// 子组件方法逻辑
}
}
```
在父组件中使用 `$refs` 访问子组件实例,并调用子组件方法:
```
<template>
<div>
<child-component ref="childComponent"></child-component>
<button @click="callChildMethod">调用子组件方法</button>
</div>
</template>
<script>
export default {
methods: {
callChildMethod() {
this.$refs.childComponent.childMethod();
}
}
}
</script>
```
注意:使用 `$refs` 访问子组件实例需要等到子组件渲染完成后才能使用。如果在父组件中使用 `$refs` 访问子组件实例时出现问题,可以考虑在 `mounted` 钩子函数中使用 `$nextTick` 方法等待子组件渲染完成。
阅读全文