Vue基于ElementUI的Dialog实现弹窗登录，登录成功前不允许关闭

业务场景

当页面比较单一，只是个单页面的时候。

优点

简单粗暴

1.使用了session来记录登录是否成功，成功后不需要再登录；
2.使用最简单的方式，可以写死用户，不需要有后台服务，当然也可以修改代码从后台校验用户登录；
3.使用回调函数来强制用户不能点击空白处也不能关闭该登录窗口。

缺点

这里只是简单实现，不适合复杂业务场景

代码

新建一个vue组件，代码如下，把这个组件引入到你的页面，就会自动弹出登录窗口

<template>
    <el-dialog width="30%" title="登录" :visible.sync="modelShow" 
    		   :show-close="false"
               :close-on-click-modal="false"
               :close-on-press-escape="false"
               :before-close="closeCallback()"
    >
        <el-form ref="form" :model="form" size="small" label-width="100px">
            <el-row>
                <el-form-item label="用户名：