关于组件之间的数据共享（超详细，一看就会）

一：父组件给子组件传值，子组件通过 props 接收

父组件：

父组件要先引入子组件

<template>
  <div id="app">
    <h1>App 根组件</h1>
    <Son :msg="message" :user="userInfo"></Son>
  </div>
</template>

<script>
import Son from './components/Son.vue'

export default {
  data () {
    return {
      message: 'hello world',
      userInfo: { name: 'zs', age: 18 }
    }
  },
  components: {
    Son
  }
}
</script>

<style></style>

子组件：

通过 props 接收，就可以拿到父组件的值啦，不过要注意的是你不可以直接修改 props 里面的值，这是不允许的