vue--父組件主動獲取子組件的方法

父組件主動獲取子組件的方法和屬性

第一步：調用自組件的時候，給自組建定義一個Header

    <v-header ref='headerInfo'></v-header>

第二步：在父組件里面通過

    this.$refs.headerInfo.屬性

    this.$refs.headerInfo.方法();

示例：

自組件：Header.vue 

<template>
    <div id="Header">
        <p>我是一個頭部組件</p>
    </div>
</template>
<script>
export default {
  name: 'HelloWorld',
  data () {
    return {
      text:'我是子組件的屬性'
    }
  },
  methods:{
    run(){
      alert('我是子組件的方法');
    }
  },
}
</script>

父組件主動調用子組件的方法：

<template>
    <div id="Header">
        <p>我是一個頭部組件</p>
    </div>
</template>
<script>
export default {
  name: 'HelloWorld',
  data () {
    return {
      text:'我是子組件的屬性'
    }
  },
  methods:{
    run(){
      alert('我是子組件的方法');
    }
  },
}
</script>