vue父组件如何把带参数的方法传给子组件
时间: 2024-02-28 14:50:37 浏览: 67
vue父组件向子组件(props)传递数据的方法
5星 · 资源好评率100%
在Vue中,父组件可以通过props属性将带参数的方法传递给子组件。下面是一个简单的示例:
父组件:
```html
<template>
<div>
<ChildComponent :childMethod="parentMethod" />
</div>
</template>
<script>
import ChildComponent from './ChildComponent.vue';
export default {
components: {
ChildComponent
},
methods: {
parentMethod(param) {
console.log('Parent method called with parameter:', param);
}
}
}
</script>
```
子组件:
```html
<template>
<div>
<button @click="childMethod('Hello from child')">Call Parent Method</button>
</div>
</template>
<script>
export default {
props: ['childMethod'],
methods: {
childMethod(param) {
this.childMethod(param);
}
}
}
</script>
```
在父组件中,我们将`parentMethod`作为props传递给子组件,并在子组件中使用`childMethod`来调用该方法。当点击子组件中的按钮时,会触发`childMethod`,并将参数传递给父组件的`parentMethod`方法。
阅读全文