子传父 对比 作用域插槽slot-scope的简单用法

1.子传父

父组件

<!--父组件-->
<template>
	<div>
       	<p>子级接收的数据----{
  {name}}</p>
       	<!--子级事件  toParent-->
       <com @toParent='resChild'></com>
	</div>
</template>

<script>
	import com from './com'
	export default{
		name:'page',
		data(){
			return {
				name:'',
				text:'page页面----',
				data:['zhangsan','lisi','wangwu','zhaoliu']
			}
		},
		components:{
			com
		},
		mounted(){
			
		},
		methods:{
			resChild(res){
				console.log(res);
				this.name=res;
			},
        }
    }
</script>

子组件

<!--子组件-->
<template>
	<div>
		<z-button @click.native='bindtap'>点击触发子传父</z-button>
	</div>
</template>

<script>
	export default{
		name:'com',
		data(){
			return {
				msg:&#