父子组件给子组件传值
第一步：爸爸将数据递给儿子，所以我们就需要在子组件绑定父组件的数据
第二步：爸爸都已经将数据给你了，那么你就要礼貌性的伸手去拿，这时我们可以利用props去接爸爸传过来的值
第三步：当你拿到值的时候，就可以随意发挥数据的作用啦
代码如下：
父组件：<template><div id="app"><chuanzhi :fatherdata='data'></chuanzhi> //绑定父组件的数据</div></template><script>import Chuanzhi from './components/chuanzhi'export default {name: 'App',data() {return {data:'哈喽~我是父组件的数据'}},components:{Chuanzhi}}</script>子组件：<template><div><p> {{ fatherdata }} </p> //展示父组件的数据</div></template><script>export default {props:{//使用props接受父组件的数据fatherdata:{type:String //限制拿到父组件数据的数据形式，这里为字符串型的数据}}}</script>
子组件给父组件传值
第一步：给子组件绑定一个事件，利用触发事件给父组件传值，这里利用this.$emit将事件和数据传递过去
第二步：子组件绑定好事件之后，父组件需要时刻监听着子组件的变化（使用v-on监听），一旦发生改变，就可以进行相关操作，并以此获得数据
代码：
父组件：<template><div id="app"><chuanzhi @senddata='getdata'></chuanzhi> //监听的事件<p> {{ sondata }}</p></div></template><script>import Chuanzhi from './components/chuanzhi'export default {name: 'App',data() {return {sondata:''}},components:{Chuanzhi},methods: {getdata(value) {this.sondata = value //事件一旦触发，便可将子组件的数据拿到手啦}}}</script>子组件：<template><div><button @click='change'>发送子组件的数据</button> //绑定一个点击事件，一旦触发，父组 件便可以监听到，然后进行相关的操作</div></template><script>export default {data() {return{message:'哈喽~我是子组件的数据'}},methods: {change() {this.$emit('senddata',this.message) //使用this.$emit给父组件传递事件和参数，第一个事件，第二个是参数，第一个事件名就是父组件监听的事件名}}}</script>
