在写加入购物车功能时，需要实现点击购物车按钮，将子组件计数组件内的num，物品数归1，但是按钮属父组件，num属性属于子组件，那么需要使用父组件调子组件方法:
代码如下：
- 父组件
<numBox :max_num="product_max_num" ref="numBox" ></numBox>
<button type="button" class="mui-btn mui-btn-danger" @click="add_shopcar" >加入购物车</button>
add_shopcar(){
//再将 数量选择器的 num 归 1，父组件调子组件的方法实现
this.$refs.numBox.changNum();
},
- 子组件
<template>
<div >
<el-input-number v-model="num1" @change="handleChange" :min="1" :max="max_num" label="描述文字" size="mini" >
</el-input-number>
</div>
</template>
<script>
export default {
data() {
return {
num1:1
}
},
//父组件传值接收
props:["max_num","num"],
methods: {
handleChange(value) {
// 暂时传入购物车保存数量 让加入购物后操作
this.$store.commit("setNumBoxCount",value);
//计数 建立和 store 中的count 数据监听
// this.getNum();
console.log(this.$store.state.count);
},
changNum(){
//点击购物车后，计数器归1
this.num1=1;
}
},
}
</script>
