vue子组件调用父组件内的方法

子组件调用父组件方法

随笔：后面时间充足了再补充

父组件

<template>
    <div>
        <head-title3 ref="headerNews3"></head-title3>
       <router-view></router-view>
    </div>
</template>
<script>
import HeadTitle3 from './HeadTitle3'
export default {
    name: 'change',
    components:{
        HeadTitle3
    },
    data (){
        return {
            title: '修改密码'
        }
    },
    methods: {
        getHeadData(){
            this.$refs.headerNews3.newsData();
        }
    },
    created () {},
    mounted () {
        this.getHeadData();
    },
}
</script>

子组件

<template>
    <div class="changePassword3">
        <div class="changePassword3main">
            <head-title4 :title2="title"></head-title4>
        </div>
        <div class="changePassword3bottom">
            <div class="changePassword3top">
                <i></i><span>修改成功！</span>
            </div>
           
        </div>
    </div>
</template>
<script>
import HeadTitle4 from './HeadTitle4'
export default {
    name: 'change3',
    components:{
        HeadTitle4
    },
    data (){
        return {
       
            title: '修改密码',
        }
    },
    methods: {
          
    },
    created () {},
    mounted () {
        this.$parent.getHeadData();
    },
}
</script>

主要使用了this.$parent调父组件

还有其他的方法，后面再补充