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調父組件

還有其他的方法，後面再補充