vue中如何把数据从公共组件传递到页面上(弹框列表形式 vue-elementui-admin)

1.背景

公共组件：弹框Table

页面column_detail：点击页面上的按钮，便触发了公共组件的弹框

页面数据逻辑：点击页面column_detail上的按钮触发公共组件Table弹框，选择弹框里面的复选框的数据，点击弹框的确定按钮后，弹框关闭，选中的数据，传到column_detail页面上去了。

2.弹框Table作为公共组件

 2.1.弹框组件的路径

 

2.2.弹框组件页面的事件

在弹框组件上定义一个open事件，让页面column_detail去引用(点击column_detail页面的按钮，触发open事件，让弹框出现)

2.2.1.定义回调函数callback(初始值为null)和允许选中复选框个数limitNum(初始值为-1)

 2.2.2.在公共组件中定义，当column_detail页面上传递过来真实的的回调函数callback和数值limitNum后，把传递过来的值赋值给公共组件中定义的callback和limitNum变量。

 

2.2.3.公共组件关闭时，公共组件选中数据后，把选中的数据，放到callback回调函数中，回传到column_detail页面

2.3.弹框组件确定按钮事件

在弹框组件上选好相应的复选框后，点击确定按钮，把选中的数据传递到column_detail页面上，并关闭弹框组件

3.colmun_detail页面

3.1.点击出现弹框的事件

3.1.1.通过在公共组件上定义的ref="showDialog"

 3.1.2.点击按钮定义点击事件handleCreateDialog

 3.1.3.handleCreateDialog事件内容