vue3 父组件调用子组件并且传参
时间: 2023-08-18 17:15:07 浏览: 118
在Vue3中,父组件可以通过使用`ref`引用子组件,并通过引用调用子组件的方法,并传递参数。下面是一个示例代码:
```javascript
<template>
<div>
<button @click="parentClick">点击</button>
<Child ref="mychild" />
</div>
</template>
<script>
import { ref } from 'vue';
import Child from './child';
export default {
name: "parent",
components: {
Child
},
methods: {
parentClick() {
this.$refs.mychild.childClick("我是子组件里面的方法哦");
}
}
}
</script>
```
在这个示例中,父组件通过`ref`引用了子组件,并在`parentClick`方法中调用了子组件的`childClick`方法,并传递了参数"我是子组件里面的方法哦"。这样子组件就可以接收到父组件传递的参数并进行相应的处理。
#### 引用[.reference_title]
- *1* *2* *3* [【vue】父向子组件传参、子组件向父传参、vue中父组件调用子组件函数、子组件向父组件调用方法](https://blog.csdn.net/weixin_42401291/article/details/90549791)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]
阅读全文