parent.vue(父组件的内容):
<template> <div @click="divClick"> <info-wnd ref="infoWnd"></info-wnd> </div> </template> <script> import infoWnd from './info-wnd'; export default { data() { return { } }, components: { infoWnd }, methods: { divClick() { this.$refs.infoWnd.infoWndClick(); //调用子组件的方法 } } } </script>
子组件info-wnd.vue内容:
<template> <div> <span>这是子组件</span> </div> </template> <script> export default { data() { return { } }, methods: { infoWndClick() { console.log('这是子组件的方法'); } } } </script>