data() {
return {
goods: [],
listHeight: [],
scrollY: 0,
selectedFood: {},
pink:"pig",
};
},
//定义一个pink值
:red="pink"
传入
props:["food","red"], // 从父元素获取值
console.log(this.red); // pig
、、、、、、、、、、、、、、、、、、、、、、、、、props分割线、、、、、、、、、、、、、、、、、、、、、、、、、
this.$emit('add', event.target); //子元素传值
<cartcontrol :food="items" @add="addFood"></cartcontrol> //父组件取值并且使用
addFood(target) { this._drop(target); }, // 监听子元素的add事件,执行addFodd函数
_drop(target) { //执行该函数
// 体验优化,异步执行下落动画
this.$nextTick(() => {
this.$refs.shopcart.drop(target); // 父组件访问子组件的方式,调用子组件的方法,传值
});
},
、、、、、、、、、、、、、、、、、、、、、、点击分割线、、、、、、、、、、、、、、、、、、、、、、、、、、、、、
Vue.set(this.food,'count',1); 改变值