父子组件传递

子组件调用父组件的方法

父组件

1
2
3
4
5
6
7
8
9
10
11
<template>
    <auth-object @loadList="listRole"></auth-object>
</template>
<script>
methods:{
    listRole(params){
        //......
    }
}
</script>

子组件auth-object

1
2
3
let data = {}
this.$emit("loadList", params)
return data

子组件获取父组件的$emit返回值

应用场景：子组件调用父组件的方法并获取到父组件方法的返回值

直接使用let data = this.$emit("loadList", params)是获取不到值的,返回的是VueComponent对象

这种写法是错误的，拿到的data是指向方法的this，无法获取到data
应该这样写

父组件

1
2
3
4
5
6
7
8
9
10
11
<template>
    <auth-object @loadList="listRole"></auth-object>
</template>
<script>
methods:{
    listRole(params, callback){
        callback(data)
    }
}
</script>

子组件auth-object

1
2
3
4
5
let data = {}
this.$emit("loadList", params, val => {
    data = val
})
return data

实时参数传入

1
:span-method="(...arg)=>strategySpanMethod(...arg,item.result.itemList)"