vue 使用layui弹框弹出element-ui表单的问题

<el-form ref="form" :model="form" :rules="rules" label-width="160px">             <el-form-item label="用户名" prop="userName">                 <el-input v-model="form.userName" size="mini" clearable class="formInputClass" @blur="showMsg=false" @focus="showMsg=true"></el-input>             </el-form-item>             <div class="msg layui-anim layui-anim-scaleSpring " v-show="showMsg">                 <span><i class="layui-icon layui-icon-tips"></i>系统会默认给用户名加上企业前缀,请适用系统生成的用户名登录</span>             </div>             <el-form-item label="用户密码" prop="password">                 <el-input type="password" v-model="form.password" size="mini" clearable class="formInputClass"></el-input>             </el-form-item>             <el-form-item label="确认密码" prop="passwordOnce">                 <el-input type="password" v-model="form.passwordOnce" size="mini" clearable class="formInputClass"></el-input>             </el-form-item>             <el-form-item label="企业" prop="relateEnterpriseName">                 <el-input v-model="form.relateEnterpriseName" size="mini" clearable class="formInputClass" disabled></el-input>             </el-form-item>             <el-form-item label="角色选择" prop="roleId">                 <el-select v-model="form.roleId" placeholder="请选择" size="mini" filterable clearable  class="formInputClass">                     <el-option v-for="(item, key) in roleOptions" :key="key" :label="item.name" :value="item.id"></el-option>                 </el-select>             </el-form-item>             <div class="btn">                 <el-button @click="checkParams" type="primary">提交</el-button>             </div>         </el-form>

 <!-- 表单 -->  <UserForm id="UserForm" slot="content" ref="UserFormRef" @update="update" :roleOptions="roleOptions" class="layui-anim layui-anim-fadein" style="display:none" />

export function x_admin_show(title, url, w, h) {     $ = layui.jquery;     let layerindex = '';     layer.open({         type: 1,         area: [w + 'px', h + 'px'],         fix: false, //不固定         maxmin: true,         shadeClose: true,         shade: 0.0,         closeBtn: 1,         title: title,         content: url, //指向弹出层子页面的链接         // shade: 0.4,   //遮罩透明度         success: function (layero, index) {             layerindex = index;         },         cancel: function (index) {             // 你点击右上角 X 取消后要做什么             layer.close(index)         },         end: function (res) {             // 关闭显示             url.css("display", 'none');         }     });     return layerindex;   // 返回index用于关闭 }

import { x_admin_show } from "@/common/tool"; this.layerIndex = x_admin_show('用户管理', $("#UserForm"), '500', '500')；// 参数分别为 标题 组件ID 宽度 高度
// this.layedIndex用于记录layer弹框的编号  通过  layer.close(this.layerIndex); // close layer 弹出层