vue中子父组件传值问题

1.子组件向父组件传值（事件调用机制：本质就是父向子传递方法，子调用方法，子将数据当作参数传给这个方法：即传值给父组件）：

1.在父组件中创建一个方法：

<p>购买数量:<number-box :id="id" @getcount="getSelectCount" :max="msglist.stock_quantity"></number-box></p>

（1）getSelectCount（）{ 父组件中的方法

}

（2）@getcount="getSelectCount"：将父组件中的方法传给子组件

2.在子组件中调用；

<input id="test" class="mui-input-numbox" type="number" value="1" @change="countChanged" ref="numbox"/>

countChanged() {

this.$emit("getcount", parseInt(this.$refs.numbox.value));

}

在子组件中通过.$emit()调用父组件传过来的方法，将子组件中的数据（this.$refs.numbox.value）当作.$emit()的一个参数传递给父组件。

2.父组件向子组件传值（事件绑定机制：本质就是在父组件中通过属性绑定将值传递给子组件，子组件通过props【】接收，然后子组件通过属性绑定使用数据）：

1. 父组件属性绑定

<p>购买数量:<number-box :id="id" @getcount="getSelectCount" :max="msglist.stock_quantity"></number-box></p>

2. 子组件接收

props: ["max"],

3. 子组件属性绑定从父组件接收到的数据

<div class="mui-numbox" data-numbox-min=‘1‘ :max="max">

原文地址：https://www.cnblogs.com/zfj6666/p/12256531.html