Vue 传值方式 ——子向父传递数据

子向父传递数据：通过 $emit 方法传递 

子组件 son 模板：

<div>{{num}}</div>

<button @click="add">添加数值</button>

子组件 son 数据：

data（）{

        return { num： 0 }

}

子组件 son 方法：

methods：{

        add（）{

                this.num += 1;

                this.$emit('changeNum',this.num) // 通过 $emit() 方法传递 第一个参数是 事件名称 第二参数传递 参数

        }

}

父组件 father 数据：

data（）{

        return { formSonNum：0} //  定义传递过来的数据 变量

}

父组件 father 模板：

<Son @changeNum="change"></Son> // 给子组件 通过 @ 绑定changeNum 事件 并赋值方法

<div>{{ formSonNum }}</div> // 渲染 传过来的数据

父组件 father 方法：

change（val）{ // 定义方法 并 接受传递过来的数据

     this. formSonNum = val;   // 进行 赋值

}