vue.js 组件监听
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了vue.js 组件监听相关的知识，希望对你有一定的参考价值。
一、在通过点击事件触发的子组件中：
addCart(event) {
if (!event._constructed) {
return;
}
if (!this.food.count) {
Vue.set(this.food, ‘count‘, 1);
} else {
this.food.count++;
}
this.$emit(‘cartadd‘, event.target)
},// cartcontrol.vue组件
二、在父组件中
<div class="cartcontrol-wrapper">
<cartcontrol :food="food" v-on:cart-add="cartAdd"></cartcontrol>
</div>// goods.vue组件中使用v-on来监听
<shopcart ref="shopcart"
:selectFoods="selectFoods"
:deliveryprice="seller.deliveryPrice"
:minprice="seller.minPrice"
>
</shopcart>
methods:{
cartadd(target) {
// 传递给子组件
this.$refs.shopcart.drop(target)
}
}
三、在接收的子组件中
methods: {
drop(el) {
console.log(el);
}
}// shopcart.vue组件
原文地址：http://coding.imooc.com/learn/questiondetail/3769.html
以上是关于vue.js 组件监听的主要内容，如果未能解决你的问题，请参考以下文章
vue.js 2 - 将单个文件组件的 html 片段提取到独立文件中