子组件向父组件传值,主要是通过this.$emit('函数名fun',所传数据datas)将值在子组件标签绑定事件 @函数名fun='父组件中的方法father',然后在父组件中定义方法
father(val){
val就是要传的数据datas
},
这样就可将之传递到父组件中可以进行使用
<body>
<div id="app">
<list-btn @demo='getDatas'></list-btn>
<p>{{msg}}</p>
</div>
</body>
<script type="text/javascript">
Vue.component('list-btn',{
data:function(){
return {
count:0
}
},
template:`
<div>
<button @click='hander'>点击</button>
</div>
`,
methods:{
hander:function(){
this.$emit('demo',this.count);
}
}
})
let app=new Vue({
el:'#app',
data:{
msg:'我是father'
},
methods:{
getDatas:function(val){
this.msg+=val;
}
}
})
</script>