vue使用scope插槽实现dialog窗口

<template slot-scope="scope">  
                          <span  @click="opendialog(scope.row)"  style="cursor: pointer; color: #2d8cf0;">
                            {{scope.row.XXX}}
                          </span>

                </template>
   
                  
                  <el-dialog
                              title="详情"
                              :visible.sync="dialog"
                              width="70%"
                              :before-close="handleClose">

                              <template>
                                <div v-if="currentRow">
                                    <el-form :label-position="labelPosition" label-width="100px" :model="currentRow" >
                                       <a-col :span="8"><el-form-item label="更新日期"><el-input v-model="currentRow.update_time"  style="width: 300px;" readonly></el-input></el-form-item></a-col>
                                     </el-form>               
                                </div>
                              </template>

                              <span slot="footer" class="dialog-footer">
                                <el-button @click="dialog= false">取 消</el-button>
                                <el-button type="primary" @click="dialog= true">确 定</el-button>
                              </span>
                 </el-dialog>
    
    定义data：
    dialog= false

    methods:{
    
      handleClose(done) {
          
              done();
      },
      opendialog(row){
             this.currentRow = row;
              // Example: Open a drawer
              this.dialog= true;
      },
      }