vue父组件给子组件传值
父组件拉起的弹窗如何把值传过去
1、在 父页面应用子页面的地方添加@refreshDataList="getDataList
<template>
<div>
// <!-- 通过点击事件拉起弹框显示内容 -->
<el-button @click="detailHandle(scope.row.id)" type="text" size="small">查看详情</el-button>
// <!-- 弹框模块 父页面应用子页面的地方添加-->
<detail ref="detail" @refreshDataList="getDataList" :pwidth="dWidth"></detail>
</div>
</template>
<script>
import detail from '../financingApply/financingApply-detail'; //弹窗内容部分
export default {
name: "***",
data() {
return {}
}
components: {
detail
},
methods: {
//点击事件
detailHandle(id){
this.$nextTick(() => {
//父页面传给子页面
this.$refs.detail.init(id);
});
},
getDataList() {
//getDataList方法里可以些业务逻辑
this.dataListLoading = true
}
}
}
</script>
在子页面中调用
//在子页面中调用
detailHandle: () => {
this.$emit("refreshDataList")
}
this.$refs:父组件向子组件通信,可以调用子组件里的属性和方法
this.$emit:子组件向父组件通信