vue 父组件传递子组件事件

  在开发中,碰到一个需要从父组件传入方法,子组件点击触发,说白了就是,把方法传入给子组件调用

 

<el-col v-for='data in spreadFormat.icons' class="" v-typeClick='data' :span='2' >{{data.icon}}</el-col>
//点击方法(method)在data中,由父组件通过子组件props传过来

  这里并不能直接用on-click:typeClick = data.method;理由是vue自定义的点击事件似乎不能直接写方法,一般是在methods里面定义,调入。这里我想到的一个处理方法,就是自己写一个directive:

directives:{
            typeClick:{
                bind(el, binding, vnode){
                    console.log(binding.value.method)
                    el.addEventListener('click', binding.value.method)
                }
            }
        }

这样既可给这个元素添加了点击事件,并且调用的是父组件传过来的方法。

posted @ 2017-10-23 14:11  岁末博  阅读(244)  评论(0编辑  收藏  举报