前言:使用ref属性来实现,ref的具体用法请自行百度。
1、子组件中声明方法:
<script>
export default {
name: 'father',
data () {
return {
}
},
methods: {
thisChildrenMethod() {
console.log("触发了子组件的thisChildrenMethod方法")
}
}
}
</script>
2.父组件中引入子组件并调用子组件中的方法:
<template>
<div id="father">
<button @click="goClick">测试</button>
<Children ref="thisChildren"/>
</div>
</template>
<script>
import Children from '../components/Children.vue' // 引入Children组件
export default {
name: 'children',
data () {
return {
}
},
methods: {
goClick() {
this.$refs.thisChildren.thisChildrenMethod() // 执行子组件中的方法
}
}
// ...其它代码
}