父組件調用子組件中的方法- this.$refs.xxx.子組件方法();


子組件中有一個說的方法 在父組件中去調用
當你點擊的時候 去調用子組件中的方法

fu.vue
在父組件的方法中調用子組件的方法,
很重要 this.$refs.mychild.parentHandleclick();

{
    <template>
    <div>
        <button @click="clickParent">點擊 調用子組件</button>
        <child ref="mychild"></child>
    </div>
    </template>
    
    <script>
    import Child from "../zi/zi";
    export default {
    components: {
        child: Child  //key:value key是組件名稱  value是被引入時的名稱
    },
    methods: {
        clickParent() {
        this.$refs.mychild.parentHandleclick();
        }
    }
    };
    </script>
 
}

zi.vue

{
    <template>
      <div ref="col">child</div>
    </template>
    
    <script>
        export default {
            methods: {
                parentHandleclick(e) {
                console.log("我是子組件在說")
                }
            }
        };
    </script>
}

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM