Vue之父组件给子组件传值和方法

父组件写好需要接受的值和方法，使用:title="title"传title属性值给子组件， :go="go"传递go方法

<template>
  <div id="root">
    <!-- 3.引用组件 -->
    <v-header :title="title" :go="go"></v-header>
  </div>
</template>

<script>
// 1.引入组件
import Header from "./components/Header.vue"
export default {
  //2.注册组件
  components:{
    'v-header': Header
  },
  data(){
    return{
     title:"首页"
    }
  },
  methods:{
    go(){
      alert("this is home")
    }
  }
}
</script>

子组件通过props接受父组件传过来的title值和go方法

<template>
    <div class="header">
        {{title}}
        <button class="button" @click="go()">点我</button>
    </div>
</template>

<script>
export default {
    props:['title',"go"]
}
</script>