vue props 传递函数
vue父子组件使用 props传递函数第一次见,再次记录下。
Props的type是函数
通过 props 传递 函数 看看有啥用。
// 父组件
</template>
<div>
<children :add='childrenClick'></children>
<p>{{countF}}</p>
</div>
</template>
<script>
import children from './Children'
export default {
name: 'HelloWorld',
data() {
return {
countF: 0,
}
},
methods: {
childrenClick(c){
this.countF += c;
}
},
components:{
children,
}
}
</script>
// 子组件
<template>
<div>
<button @click="handClick(count)">点击加 1 </button>
</div>
</template>
<script>
export default {
data() {
return {
count:1,
}
},
props:{
add:{
type: Function
}
},
methods: {
handClick(){
this.add( ++this.count); // 父组件方法
}
},
}
可以看到 chirden 组件在中 使用 props.add() , 调用的是 父组件的方法。
转载连接: https://blog.csdn.net/qq_39085060/article/details/105868950