Vue的子组件向父组件传递参数，提供了$emit方法
$emit有两个参数，$emit(‘事件名’,传递的参数)，两个参数后续说明，上代码；
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>v-model</title>
<script src="vue.js"></script>
<link rel="icon" href="01_飞机.png" >
</head>
<body>
<div id='model' :style="{ fontSize: postFontSize + 'em'}">
<count-time @getcount='changeSize'></count-time>
</div>
<script>
Vue.component('count-time',{
data: function(){//组件中的data必须是一个函数
return {
count: 20
}
},
template: "<button @click='handleClick'>点击扩大</button>",
methods:{
handleClick:function(){
this.$emit('getcount',this.count);
}
}
})
var model = new Vue({
el: '#model',
data:{
postFontSize:0
},
methods:{
changeSize:function(index){//这里的index获取的是count的值
this.postFontSize += index
}
}
})
</script>
</body>
</html>实现了属性fontsize的扩大，这里只是为了说明$emit的用法，不是为了实现功能
点击button后，button下移动，说明fontsize的扩大了
代码说明
$emit('getcount',this.count);这里getcount是事件名，而this.count是要传递给父组件的参数。
template模板中的@click点击绑定的是handleClick,点击后就会调用自定义的handleClick函数，$emit('getcount',this.count)就会执行，但是此时count并没有传递给父组件。
然后需要在dom中利用$emit创建的getcount事件，并绑定父组件自定义的changeSize函数，这时count才传递给父组件。
父组件的函数参数index此时接收了子组件的count参数 ，index = count = 20