* 使用iview的表单组件实现登录页的登录框 ~~~  <template>   <div class="login-wrapper d-flex justify-content-center">   <div class=" bg-white login-header rounded p-3 pt-3">   <div class="mb-4 d-flex flex-column align-items-center justify-content-center">   <div class="d-flex align-items-center">   <Icon type="md-briefcase" size="55" color="#2db7f5" />   <h3 class="text-muted ml-2">企业网盘</h3>   </div>   <span class="text-muted small mt-3">企业级网盘解决方案</span>   </div>   <Form :label-width="0">   <FormItem>      <Input v-model="formItem.username" placeholder="请输入用户名..."></Input>   </FormItem>   <FormItem>      <Input type="password" v-model="formItem.password" placeholder="请输入密码..."></Input>   </FormItem>   <div class="d-flex align-items-center mb-2">   <Checkbox v-model="formItem.remember">自动登录</Checkbox>   <a href="#" class="ml-auto small">忘记密码?</a>   <span class="mx-1">|</span>   <a href="#" class="small">注册账户</a>   </div>   <FormItem>      <Button type="primary" long>登录</Button>   </FormItem>   </Form>   </div>   </div>  </template>  ​  <script>  export default {   data(){   return {   formItem : {   username : "",   password : "",   remember : false   }   }   }  }  </script>  ​  <style scoped="scoped">  .login-wrapper{   height : 100%;   background-color: #515a56;  }  .login-header{   width: 380px;   margin-top: 50px;   height: max-content;  }  </style>  ​ ~~~