La realización del valor de retorno después de que el cuadro emergente debajo de Vue + Elemento selecciona el valor

1. Entorno de prueba:

1.VER

2.Elemento

2. Descripción de la función:

Aparece un cuadro de selección, seleccione un registro, haga clic en Aceptar para devolver el valor del registro a la página

Tres, el código clave:

1. Página principal:

<template>
<el-button icon="el-icon-add" size="small" type="primary" @click="openDialog">选择</el-button>
<el-dialog title="选择" :visible.sync="dialogVisible" v-if="dialogVisible" center append-to-body>
<Mydialog @close="closeDialog"></Mydialog>
</el-dialog>
</template>
<script>
import Mydialog from './mydialog'
export default{
     methods:{
        openDialog(){
           this.dialogVisible=true;  
        },
        closeDialog(model){
           console.info("选择的结果是:",model);
           this.dialogVisible=false;
        }
     },
     components:{
        Mydialog
     },
     data(){
        return {
          dialogVisible:false
        }
     }
}
</script>

2. Página de cuadro emergente:

<template>
    <el-button type="primary" size="small" @click="closeDialog">取消</el-button>
    <el-button type="primary" size="small" @click="saveDialog">保存</el-button>
</template>
<script>
    export default{
       methods:{
          closeDialog(entity){
             this.$emit('close',entity);
          },
          saveDialog(){
             this.closeDialog(this.model);
          }
       },
       data(){
         return {
            model:{
              id:'',
              name:''
            }
         }
       }
    }
</script>

 

(Fin del texto completo)