码迷,mamicode.com
首页 > 其他好文 > 详细

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

时间:2019-08-06 01:03:09      阅读:183      评论:0      收藏:0      [点我收藏+]

标签:组件   click   xxx   key   from   this   span   方法   exp   

子组件中有一个说的方法 在父组件中去调用
当你点击的时候 去调用子组件中的方法

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>
}

 

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

标签:组件   click   xxx   key   from   this   span   方法   exp   

原文地址:https://www.cnblogs.com/IwishIcould/p/11306344.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!