父组件调用子组件函数
用法:子组件上定义ref="refName", 父组件的方法中用 this.$refs.refName.method 去调用子组件方法
子组件 文件名 Child.vue
<template>
<div>
我是子组件
</div>
</template>
<script>
export default {
name: "child",
methods: {
childClick(e) {
console.log(e);
}
}
}
</script>
父组件 文件名 Father.vue
<template>
<div>
<button @click="parentClick">点击</button>
<Child ref="mychild"></Child> //调用子组件
</div>
</template>
<script>
import Child from './Child.vue'; //引入子组件Child
export default {
name: "Father",
components: {
Child // 将组件隐射为标签
},
methods: {
parentClick() {
this.$refs.mychild.childClick("我是传递到子组件中的参数"); // 调用子组件的方法childClick
}
}
}
</script>
Comments | NOTHING