1、使用this.$emit 子组件向父组件传递事件以及携带数据
在标签内调用 methods:{ } 中的方法时候是不能够加()的,一定是直接写方法名称即可, 否则传递的参数数据无效。
<list v-show="listShow" :listData="listData" @titleHandle = "showTitle"></list>
这里的titleHandle是监听子组件传递过来的事件(带有参数),showTitle是父组件监听成功之后在父组件内执行的方法,【注意这里@titleHandle = "showTitle"的showTitle后面不能加(),里面也不能传参】
子组件:
methods:{
getTitle(title){
this.$emit('titleHandle',title)
}
},
父组件:
methods: {
showTitle(title){
console.log(title)
}
},
2、在vue组件内,如果要对组件内的数据做逻辑判断,那么这个逻辑应该写在计算属性computed内,一般不放在模板内
computed:{
num(){ //在模板里面直接{{num}}即可
return ... //这里面对值做逻辑处理、筛选等等
}
}
©著作权归作者所有:来自51CTO博客作者xxxpjgl的原创作品,如需转载,请注明出处,否则将追究法律责任