element UI 表格嵌套 dialog

在使用 element UI 碰到一个需求 就是在表格中需要有一个按钮 点击按钮弹出弹框 

弹框里再嵌套表格 如图：

如图

文档上的使用方法是：

http://element-cn.eleme.io/#/zh-CN/component/dialog

上自己的代码吧

---

html部分

<el-table-column align= "center" prop="shop_num" label="使用店铺的数量" width="120" :resizable='false'>

                            <template slot-scope="scope">

                                    <el-button type="text" size=small @click="getShopData(scope)">@{{ scope.row.shop_num }} (点击查看店铺)</el-button>

                            </template>

                        </el-table-column>

<el-dialog :title="useBoxTitile" align= "center" :visible.sync="dialogTableVisible">

                <el-table :data="shopInfoData" border>

                    <el-table-column prop="shop_index" label="序号" width="150" align= "center"></el-table-column>

                    <el-table-column prop="shop_type" label="店铺类型" width="200" align= "center"></el-table-column>

                    <el-table-column prop="shop_name" label="店铺名" align= "center"></el-table-column>

                    <el-table-column prop="person_name" label="店长姓名" align= "center"></el-table-column>

                </el-table>

            </el-dialog>

---

js部分

ajax里

self.useBoxTitile = scope.row.act_name

 self.dialogTableVisible = true