1.概述

在列表中，点击按钮弹出自定义组件，点击按钮关闭当前窗口并刷新列表。

2.实现方式

2.1定义自定义组件

<template>
    <div>
        {{data.user.name}}
        <a-button @click="closeWin">close</a-button>
    </div>
</template>

<script>
import {Util} from "jpaas-common-lib";
export default {
    name: "DemoForm",
    props:{
        "data":{
            type:Object
        },"layerid":{
            type:String
        },
        "destroy":{
            type:Function
        }
    },
    methods:{
        closeWin(){
            Util.close(this,"ok",{name:"ray"})
        }
    }
}
</script>

自定义组件需要定义 data 属性，自定义组件需要定义 layerid destroy 属性。

这个组件实现了：

1. 从父页面放子页面传递数据。
2. 将数据返回到父页面。

2.2 在列表中打开组件

编写事件

2.2.1 打开自定义组件

onabc(){
    //data 表示传递数据
    var conf={component:"modules/demo/DemoForm.vue",max:false,widthHeight:[  '800px',   '600px'],curVm: this,
        data:{user:{name:"ray",address:"gz"}},
    };
    var self_=this;
   this.openComponent(conf, function(rtn,data){
       //获取返回数据
           console.info(data);
       //子表刷新
       self_.onRefresh();
   })
}

conf 的 data 为传递数据到自定义组件。
注意这个组件路径是相对于 views 目录的。

2.2.2 打开URL弹框

onabc(){
    this.openUrl({
        url:'http://www.163.com',
        curVm:this,
        max:true,
        title: ''
        },function (action){
      })
}