## vue学习笔记

### 组件之间的通讯
1. 父组件到子组件
```js
//father
<div>
<son msg="父组件的信息写在这"></son>
<son title="title"></son>
<!--:title-->
</div>
<script>
export default {
data(){
return {
title: ‘当传递一个变量过去的时候‘
}
}
}
//当传递绑定的变量

</script>
//son
<div>
<p>{{ msg }}</p>
</div>
<script>
export default {
prosp:[‘msg‘]
}
</script>
```

2. 子组件到父组件消息传递
```js
//子组建
<template>
<button click="anyName( 5 ,3, $event)">点击按钮</button>
<!--@click-->
</template>
<script>
export default {
//定义方法
methods:{
//自定义事件
anyName( num,num1 ,event){
console.log(1);
this.$emit(‘fatherevent‘, num,num1,event )
}
}
}
</script>
//父组件
<template>
<div>
<btn fatherevent="any"></btn>
<!--@fatherevent-->
</div>
</template>
<script>
import btn from "@/components/btn"
export default {
components: {
btn
},
methods:{
any(a,b,c){
console.log(‘father‘)
console.log( a,b,c )
}
}
}
</script>

在父组件中绑定一个自定义事件
在子组建发射 this.$emit(‘fatherevent‘, num,num1,event )

```

## vue学习笔记--简单父子组件--