Vue父组件调用子组件方法

最新推荐文章于 2024-08-29 20:00:00 发布

皮小哥

最新推荐文章于 2024-08-29 20:00:00 发布

阅读量252

点赞数

分类专栏： Vue 文章标签： vue

本文链接：https://blog.csdn.net/fu007good/article/details/107564201

版权

Vue 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

Vue父组件调用子组件方法

暂时只找到这一种方法

// father.vue
<template>
  <div>
    <Child ref="child" />
    <el-row>
      <el-button @click="showName">点击</el-button>
    </el-row>
  </div>
</template>

<script>
	import Child from './Child'
	export default {
	  name:'Father', 
	  components:{ Child },
	  methods:{
	    showName(){
	      this.$refs.children.showName()
	    }
	  }
	}
</script>

// child.vue
<template>
  <div>
    我是Child
  </div>
</template>
	
<script>
	export default {
	  name:'Child',
	  methods:{
	    showName(){
	      console.log('Child')
	    }
	  }
	}
</script>