devbox
IT小白
这个屌丝很懒，什么也没留下！
关注作者
热门标签
热门文章
当前位置:   article > 正文

vue3使用el-form实现登录、注册功能，且进行表单验证（Element Plus中的el-form）_vue登录注册表单切换

作者：IT小白 | 2024-04-17 04:38:39

赞

踩

vue登录注册表单切换

简介：Element Plus 中的 el-form 是一个表单组件，用于快速构建表单并进行数据校验。它提供了丰富的表单元素和验证规则，使表单开发变得更加简单和高效。可以搭配el-dialog实现当前页面的登录、注册页 ，这两天在vue3中用到了表单登录，特意记录一下，这里没有封装，直接使用的。

效果：

1、登录页面，弹出框表单

  1. <el-dialog v-model="dialogFormVisible" class="poup_box">
  2.  
  3.   <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
  4.  
  5.           <el-tab-pane label="登录" name="login_one">
  6.             <el-form ref="ruleFormRef" :model="loginForm" :rules="loginRules" class="login_one">
  7.               <el-form-item label="用户" prop="username" v-if="loginStatus">
  8.                 <el-input clearable v-model="loginForm.username" autocomplete="off" placeholder="请输入用户名" />
  9.               </el-form-item>
  10.               <el-form-item label="邮箱" prop="email" v-else>
  11.                 <el-input v-model="loginForm.email" autocomplete="off" placeholder="请输入邮箱" />
  12.               </el-form-item>
  13.               <el-form-item label="密码" prop="password">
  14.                 <el-input v-model="loginForm.password" type="password" show-password autocomplete="off"
  15.                   placeholder="请输入密码" />
  16.               </el-form-item>
  17.               <el-form-item class="forget_item">
  18.                 <div @click="changeEmail">
  19.                   <span v-if="loginStatus">邮箱登录</span>
  20.                   <span v-else>用户名登录</span>
  21.                 </div>
  22.               </el-form-item>
  23.               <el-form-item class="checks_box">
  24.                 <el-checkbox v-model="checked1" size="large" class="checks_inpt" />
  25.                 <div class="checks_text">
  26.                   <span>我已阅读并同意</span>
  27.                   <b @click="changeAgreement">服务条款、</b>
  28.                   <b>隐私政策</b>
  29.                 </div>
  30.                 <div class="userDeal" v-if="userDeal">请阅读并同意协议</div>
  31.               </el-form-item>
  32.               <el-form-item class="login_item">
  33.                 <el-button @click="userLogin(ruleFormRef)" :loading="isLoading">
  34.                   <span v-if="isLoading">登录中......</span>
  35.                   <span v-else>登录</span>
  36.                 </el-button>
  37.               </el-form-item>
  38.             </el-form>
  39.           </el-tab-pane>
  40.  
  41.           <el-tab-pane label="注册" name="register_two">
  42.             <el-form ref="ruleFormRef2" :model="registerForm" :rules="registerRules" class="register_two">
  43.               <el-form-item label="用户" prop="username">
  44.                 <el-input clearable v-model="registerForm.username" autocomplete="off" placeholder="请输入用户名" />
  45.               </el-form-item>
  46.               <el-form-item label="邮箱" prop="email">
  47.                 <el-input v-model="registerForm.email" autocomplete="off" placeholder="请输入邮箱" />
  48.               </el-form-item>
  49.               <el-form-item label="密码" prop="password">
  50.                 <el-input v-model="registerForm.password" type="password" show-password autocomplete="off"
  51.                   placeholder="密码由字母、数字或符号组成" />
  52.               </el-form-item>
  53.               <el-form-item label="邮箱验证码" prop="smsCode" class="auth_code">
  54.                 <el-input v-model="registerForm.smsCode" autocomplete="off" placeholder="请输入验证码" />
  55.                 <div class="auth_text">
  56.                   <span @click="getAuthCode(ruleFormRef2)" v-if="authCodeNum">获取验证码</span>
  57.                   <span class="auth_time" v-else>{{ registerNum }}秒后重发</span>
  58.                 </div>
  59.               </el-form-item>
  60.               <el-form-item class="checks_box">
  61.                 <el-checkbox v-model="registerCks" size="large" class="checks_inpt" />
  62.                 <div class="checks_text">
  63.                   <span>我已阅读并同意</span>
  64.                   <b @click="changeAgreement">服务条款、</b>
  65.                   <b>隐私政策</b>
  66.                 </div>
  67.                 <div class="userDeal" v-if="registerDeal">请阅读并同意协议</div>
  68.               </el-form-item>
  69.               <el-form-item class="login_item register_item">
  70.                 <el-button @click="registerUser(ruleFormRef2)">注册</el-button>
  71.               </el-form-item>
  72.             </el-form>
  73.           </el-tab-pane>
  74.  
  75.   </el-tabs>
  76.  
  77. </el-dialog>

2、相关参数，多去少补

  1. import { ElMessage } from 'element-plus'
  2. //import { ref,reactive,toRefs,computed } from 'vue';
  3. //import { useStore } from 'vuex';
  4. import { useRouter, useRoute } from 'vue-router';
  5. //const store = useStore();
  6. const router = useRouter();
  7. //const route = useRoute();
  8. //const state = reactive({});
  9. import { reactive, ref, onMounted } from 'vue';
  10. import func from 'vue-temp/vue-editor-bridge';
  11.  
  12. const loginStatus = ref(true);//用户/邮箱
  13. const isLoading = ref(false); //按钮loading  
  14. import type { FormInstance, FormRules } from 'element-plus';
  15. const ruleFormRef = ref<FormInstance>()
  16. const ruleFormRef2 = ref<FormInstance>()
  17. // 用户登录还是邮箱登录
  18. function changeEmail() {
  19.   loginStatus.value = !loginStatus.value;
  20. }
  21. // 登录
  22. const loginForm = reactive({
  23.   code: "",
  24.   email: "",
  25.   password: "",
  26.   smsCode: "",
  27.   username: "",
  28.   uuid: ""
  29. })
  30. const loginRules = reactive({
  31.   username: [
  32.     {
  33.       required: true,
  34.       message: '用户名为4~16字符之间（中文、字母、数字或下划线）',
  35.       min: 6, max: 18,
  36.       trigger: 'blur',
  37.     },],
  38.   email: [
  39.     { required: true, message: '请填写正确的邮箱格式', trigger: 'blur' },
  40.     { min: 6, max: 18, message: '邮箱字符为6~18之间', trigger: 'blur' },
  41.   ],
  42.   password: [
  43.     {
  44.       required: true,
  45.       message: '密码为6~18位字母、数字和符号',
  46.       min: 6, max: 18,
  47.       trigger: 'blur',
  48.     },
  49.     // { min: 6, max: 18, message: '密码字符为6~18之间', trigger: 'blur' },
  50.   ],
  51. })
  52. // 注册
  53. const registerForm = reactive({
  54.   code: "",
  55.   email: "",
  56.   password: "",
  57.   smsCode: "",
  58.   username: "",
  59.   uuid: ""
  60. })
  61. const registerRules = reactive({
  62.   username: [
  63.     { required: true, message: '用户名为4~16位之间字符', trigger: 'blur', },
  64.     { min: 4, max: 16, message: '4~16位中文、字母、数字或下划线', trigger: 'blur' },
  65.   ],
  66.   email: [
  67.     { required: true, message: '请填写正确的邮箱格式', trigger: 'blur' },
  68.     { min: 6, max: 18, message: '邮箱为6~18位之间字符', trigger: 'blur' },
  69.   ],
  70.   password: [
  71.     {
  72.       required: true,
  73.       message: '密码为6~18位字符，必须包含字母、数字和符号',
  74.       min: 6, max: 18,
  75.       trigger: 'blur',
  76.     },
  77.   ],
  78.   smsCode: [
  79.     {
  80.       required: true,
  81.       message: '请输入验证码',
  82.       trigger: 'blur',
  83.     },
  84.   ],
  85. })
  86. const checked1 = ref(false);//登录协议
  87. const userDeal = ref(false);//提示用户
  88. const registerCks = ref(false);//注册协议
  89. const registerDeal = ref(false);//注册状态
  90. const authInfo = reactive({})//注册uuid
  91. //登录信息
  92. const loginInfo = reactive({})
  93. // const formLoading = ref(false);
  94. //弹框默认
  95. const dialogFormVisible = ref(false);
  96. //tab默认选中
  97. const activeName = ref('login_one')
  98. //注册/登录
  99. const loginOrRetister = ref(true);
  100. //验证码时间
  101. const registerNum = ref(180);
  102. //文字还是验证码
  103. const authCodeNum = ref(true);

3、事件方法

  1. <script setup lang='ts'>
  2.  
  3. // tab切换事件
  4. function handleClick(tab, event) {
  5.   const iAgree = document.querySelector(".form_footer");
  6.   if (activeName.value === "register_two") {// 注册
  7.     loginOrRetister.value = true;
  8.     iAgree.style.display = "none";
  9.   } else if (activeName.value === "login_one") {// 登录
  10.     loginOrRetister.value = false;
  11.     iAgree.style.display = "block";
  12.   }
  13. }
  14.  
  15. // 右上角注册/登录状态切换
  16. function choseResgister() {
  17.   if (loginOrRetister.value === true) {
  18.     loginOrRetister.value = false;
  19.     activeName.value = "register_two";
  20.   } else if (loginOrRetister.value === false) {
  21.     loginOrRetister.value = true;
  22.     activeName.value = "login_one";
  23.   }
  24. }
  25.  
  26. </script>

这里的Element Plus组件使用的全局引入，所以可以直接使用；

样式大家自己写下吧！

然后点击登录、注册时，表单里的输入框验证，也有做，但是有时管用，有时不管用，这里给大家文档地址，自己看吧！

表单验证icon-default.png?t=N7T8https://element-plus.org/zh-CN/component/form.html#%E8%A1%A8%E5%8D%95%E6%A0%A1%E9%AA%8C

表单校验详情页icon-default.png?t=N7T8https://element-plus.run/#eyJzcmMvQXBwLnZ1ZSI6Ijx0ZW1wbGF0ZT5cbiAgPGVsLWZvcm1cbiAgICByZWY9XCJydWxlRm9ybVJlZlwiXG4gICAgOm1vZGVsPVwicnVsZUZvcm1cIlxuICAgIDpydWxlcz1cInJ1bGVzXCJcbiAgICBsYWJlbC13aWR0aD1cIjEyMHB4XCJcbiAgICBjbGFzcz1cImRlbW8tcnVsZUZvcm1cIlxuICAgIDpzaXplPVwiZm9ybVNpemVcIlxuICAgIHN0YXR1cy1pY29uXG4gID5cbiAgICA8ZWwtZm9ybS1pdGVtIGxhYmVsPVwiQWN0aXZpdHkgbmFtZVwiIHByb3A9XCJuYW1lXCI+XG4gICAgICA8ZWwtaW5wdXQgdi1tb2RlbD1cInJ1bGVGb3JtLm5hbWVcIiAvPlxuICAgIDwvZWwtZm9ybS1pdGVtPlxuICAgIDxlbC1mb3JtLWl0ZW0gbGFiZWw9XCJBY3Rpdml0eSB6b25lXCIgcHJvcD1cInJlZ2lvblwiPlxuICAgICAgPGVsLXNlbGVjdCB2LW1vZGVsPVwicnVsZUZvcm0ucmVnaW9uXCIgcGxhY2Vob2xkZXI9XCJBY3Rpdml0eSB6b25lXCI+XG4gICAgICAgIDxlbC1vcHRpb24gbGFiZWw9XCJab25lIG9uZVwiIHZhbHVlPVwic2hhbmdoYWlcIiAvPlxuICAgICAgICA8ZWwtb3B0aW9uIGxhYmVsPVwiWm9uZSB0d29cIiB2YWx1ZT1cImJlaWppbmdcIiAvPlxuICAgICAgPC9lbC1zZWxlY3Q+XG4gICAgPC9lbC1mb3JtLWl0ZW0+XG4gICAgPGVsLWZvcm0taXRlbSBsYWJlbD1cIkFjdGl2aXR5IGNvdW50XCIgcHJvcD1cImNvdW50XCI+XG4gICAgICA8ZWwtc2VsZWN0LXYyXG4gICAgICAgIHYtbW9kZWw9XCJydWxlRm9ybS5jb3VudFwiXG4gICAgICAgIHBsYWNlaG9sZGVyPVwiQWN0aXZpdHkgY291bnRcIlxuICAgICAgICA6b3B0aW9ucz1cIm9wdGlvbnNcIlxuICAgICAgLz5cbiAgICA8L2VsLWZvcm0taXRlbT5cbiAgICA8ZWwtZm9ybS1pdGVtIGxhYmVsPVwiQWN0aXZpdHkgdGltZVwiIHJlcXVpcmVkPlxuICAgICAgPGVsLWNvbCA6c3Bhbj1cIjExXCI+XG4gICAgICAgIDxlbC1mb3JtLWl0ZW0gcHJvcD1cImRhdGUxXCI+XG4gICAgICAgICAgPGVsLWRhdGUtcGlja2VyXG4gICAgICAgICAgICB2LW1vZGVsPVwicnVsZUZvcm0uZGF0ZTFcIlxuICAgICAgICAgICAgdHlwZT1cImRhdGVcIlxuICAgICAgICAgICAgbGFiZWw9XCJQaWNrIGEgZGF0ZVwiXG4gICAgICAgICAgICBwbGFjZWhvbGRlcj1cIlBpY2sgYSBkYXRlXCJcbiAgICAgICAgICAgIHN0eWxlPVwid2lkdGg6IDEwMCVcIlxuICAgICAgICAgIC8+XG4gICAgICAgIDwvZWwtZm9ybS1pdGVtPlxuICAgICAgPC9lbC1jb2w+XG4gICAgICA8ZWwtY29sIGNsYXNzPVwidGV4dC1jZW50ZXJcIiA6c3Bhbj1cIjJcIj5cbiAgICAgICAgPHNwYW4gY2xhc3M9XCJ0ZXh0LWdyYXktNTAwXCI+LTwvc3Bhbj5cbiAgICAgIDwvZWwtY29sPlxuICAgICAgPGVsLWNvbCA6c3Bhbj1cIjExXCI+XG4gICAgICAgIDxlbC1mb3JtLWl0ZW0gcHJvcD1cImRhdGUyXCI+XG4gICAgICAgICAgPGVsLXRpbWUtcGlja2VyXG4gICAgICAgICAgICB2LW1vZGVsPVwicnVsZUZvcm0uZGF0ZTJcIlxuICAgICAgICAgICAgbGFiZWw9XCJQaWNrIGEgdGltZVwiXG4gICAgICAgICAgICBwbGFjZWhvbGRlcj1cIlBpY2sgYSB0aW1lXCJcbiAgICAgICAgICAgIHN0eWxlPVwid2lkdGg6IDEwMCVcIlxuICAgICAgICAgIC8+XG4gICAgICAgIDwvZWwtZm9ybS1pdGVtPlxuICAgICAgPC9lbC1jb2w+XG4gICAgPC9lbC1mb3JtLWl0ZW0+XG4gICAgPGVsLWZvcm0taXRlbSBsYWJlbD1cIkluc3RhbnQgZGVsaXZlcnlcIiBwcm9wPVwiZGVsaXZlcnlcIj5cbiAgICAgIDxlbC1zd2l0Y2ggdi1tb2RlbD1cInJ1bGVGb3JtLmRlbGl2ZXJ5XCIgLz5cbiAgICA8L2VsLWZvcm0taXRlbT5cbiAgICA8ZWwtZm9ybS1pdGVtIGxhYmVsPVwiQWN0aXZpdHkgdHlwZVwiIHByb3A9XCJ0eXBlXCI+XG4gICAgICA8ZWwtY2hlY2tib3gtZ3JvdXAgdi1tb2RlbD1cInJ1bGVGb3JtLnR5cGVcIj5cbiAgICAgICAgPGVsLWNoZWNrYm94IGxhYmVsPVwiT25saW5lIGFjdGl2aXRpZXNcIiBuYW1lPVwidHlwZVwiIC8+XG4gICAgICAgIDxlbC1jaGVja2JveCBsYWJlbD1cIlByb21vdGlvbiBhY3Rpdml0aWVzXCIgbmFtZT1cInR5cGVcIiAvPlxuICAgICAgICA8ZWwtY2hlY2tib3ggbGFiZWw9XCJPZmZsaW5lIGFjdGl2aXRpZXNcIiBuYW1lPVwidHlwZVwiIC8+XG4gICAgICAgIDxlbC1jaGVja2JveCBsYWJlbD1cIlNpbXBsZSBicmFuZCBleHBvc3VyZVwiIG5hbWU9XCJ0eXBlXCIgLz5cbiAgICAgIDwvZWwtY2hlY2tib3gtZ3JvdXA+XG4gICAgPC9lbC1mb3JtLWl0ZW0+XG4gICAgPGVsLWZvcm0taXRlbSBsYWJlbD1cIlJlc291cmNlc1wiIHByb3A9XCJyZXNvdXJjZVwiPlxuICAgICAgPGVsLXJhZGlvLWdyb3VwIHYtbW9kZWw9XCJydWxlRm9ybS5yZXNvdXJjZVwiPlxuICAgICAgICA8ZWwtcmFkaW8gbGFiZWw9XCJTcG9uc29yc2hpcFwiIC8+XG4gICAgICAgIDxlbC1yYWRpbyBsYWJlbD1cIlZlbnVlXCIgLz5cbiAgICAgIDwvZWwtcmFkaW8tZ3JvdXA+XG4gICAgPC9lbC1mb3JtLWl0ZW0+XG4gICAgPGVsLWZvcm0taXRlbSBsYWJlbD1cIkFjdGl2aXR5IGZvcm1cIiBwcm9wPVwiZGVzY1wiPlxuICAgICAgPGVsLWlucHV0IHYtbW9kZWw9XCJydWxlRm9ybS5kZXNjXCIgdHlwZT1cInRleHRhcmVhXCIgLz5cbiAgICA8L2VsLWZvcm0taXRlbT5cbiAgICA8ZWwtZm9ybS1pdGVtPlxuICAgICAgPGVsLWJ1dHRvbiB0eXBlPVwicHJpbWFyeVwiIEBjbGljaz1cInN1Ym1pdEZvcm0ocnVsZUZvcm1SZWYpXCI+XG4gICAgICAgIENyZWF0ZVxuICAgICAgPC9lbC1idXR0b24+XG4gICAgICA8ZWwtYnV0dG9uIEBjbGljaz1cInJlc2V0Rm9ybShydWxlRm9ybVJlZilcIj5SZXNldDwvZWwtYnV0dG9uPlxuICAgIDwvZWwtZm9ybS1pdGVtPlxuICA8L2VsLWZvcm0+XG48L3RlbXBsYXRlPlxuXG48c2NyaXB0IGxhbmc9XCJ0c1wiIHNldHVwPlxuaW1wb3J0IHsgcmVhY3RpdmUsIHJlZiB9IGZyb20gJ3Z1ZSdcbmltcG9ydCB0eXBlIHsgRm9ybUluc3RhbmNlLCBGb3JtUnVsZXMgfSBmcm9tICdlbGVtZW50LXBsdXMnXG5cbmludGVyZmFjZSBSdWxlRm9ybSB7XG4gIG5hbWU6IHN0cmluZ1xuICByZWdpb246IHN0cmluZ1xuICBjb3VudDogc3RyaW5nXG4gIGRhdGUxOiBzdHJpbmdcbiAgZGF0ZTI6IHN0cmluZ1xuICBkZWxpdmVyeTogYm9vbGVhblxuICB0eXBlOiBzdHJpbmdbXVxuICByZXNvdXJjZTogc3RyaW5nXG4gIGRlc2M6IHN0cmluZ1xufVxuXG5jb25zdCBmb3JtU2l6ZSA9IHJlZignZGVmYXVsdCcpXG5jb25zdCBydWxlRm9ybVJlZiA9IHJlZjxGb3JtSW5zdGFuY2U+KClcbmNvbnN0IHJ1bGVGb3JtID0gcmVhY3RpdmU8UnVsZUZvcm0+KHtcbiAgbmFtZTogJ0hlbGxvJyxcbiAgcmVnaW9uOiAnJyxcbiAgY291bnQ6ICcnLFxuICBkYXRlMTogJycsXG4gIGRhdGUyOiAnJyxcbiAgZGVsaXZlcnk6IGZhbHNlLFxuICB0eXBlOiBbXSxcbiAgcmVzb3VyY2U6ICcnLFxuICBkZXNjOiAnJyxcbn0pXG5cbmNvbnN0IHJ1bGVzID0gcmVhY3RpdmU8Rm9ybVJ1bGVzPFJ1bGVGb3JtPj4oe1xuICBuYW1lOiBbXG4gICAgeyByZXF1aXJlZDogdHJ1ZSwgbWVzc2FnZTogJ1BsZWFzZSBpbnB1dCBBY3Rpdml0eSBuYW1lJywgdHJpZ2dlcjogJ2JsdXInIH0sXG4gICAgeyBtaW46IDMsIG1heDogNSwgbWVzc2FnZTogJ0xlbmd0aCBzaG91bGQgYmUgMyB0byA1JywgdHJpZ2dlcjogJ2JsdXInIH0sXG4gIF0sXG4gIHJlZ2lvbjogW1xuICAgIHtcbiAgICAgIHJlcXVpcmVkOiB0cnVlLFxuICAgICAgbWVzc2FnZTogJ1BsZWFzZSBzZWxlY3QgQWN0aXZpdHkgem9uZScsXG4gICAgICB0cmlnZ2VyOiAnY2hhbmdlJyxcbiAgICB9LFxuICBdLFxuICBjb3VudDogW1xuICAgIHtcbiAgICAgIHJlcXVpcmVkOiB0cnVlLFxuICAgICAgbWVzc2FnZTogJ1BsZWFzZSBzZWxlY3QgQWN0aXZpdHkgY291bnQnLFxuICAgICAgdHJpZ2dlcjogJ2NoYW5nZScsXG4gICAgfSxcbiAgXSxcbiAgZGF0ZTE6IFtcbiAgICB7XG4gICAgICB0eXBlOiAnZGF0ZScsXG4gICAgICByZXF1aXJlZDogdHJ1ZSxcbiAgICAgIG1lc3NhZ2U6ICdQbGVhc2UgcGljayBhIGRhdGUnLFxuICAgICAgdHJpZ2dlcjogJ2NoYW5nZScsXG4gICAgfSxcbiAgXSxcbiAgZGF0ZTI6IFtcbiAgICB7XG4gICAgICB0eXBlOiAnZGF0ZScsXG4gICAgICByZXF1aXJlZDogdHJ1ZSxcbiAgICAgIG1lc3NhZ2U6ICdQbGVhc2UgcGljayBhIHRpbWUnLFxuICAgICAgdHJpZ2dlcjogJ2NoYW5nZScsXG4gICAgfSxcbiAgXSxcbiAgdHlwZTogW1xuICAgIHtcbiAgICAgIHR5cGU6ICdhcnJheScsXG4gICAgICByZXF1aXJlZDogdHJ1ZSxcbiAgICAgIG1lc3NhZ2U6ICdQbGVhc2Ugc2VsZWN0IGF0IGxlYXN0IG9uZSBhY3Rpdml0eSB0eXBlJyxcbiAgICAgIHRyaWdnZXI6ICdjaGFuZ2UnLFxuICAgIH0sXG4gIF0sXG4gIHJlc291cmNlOiBbXG4gICAge1xuICAgICAgcmVxdWlyZWQ6IHRydWUsXG4gICAgICBtZXNzYWdlOiAnUGxlYXNlIHNlbGVjdCBhY3Rpdml0eSByZXNvdXJjZScsXG4gICAgICB0cmlnZ2VyOiAnY2hhbmdlJyxcbiAgICB9LFxuICBdLFxuICBkZXNjOiBbXG4gICAgeyByZXF1aXJlZDogdHJ1ZSwgbWVzc2FnZTogJ1BsZWFzZSBpbnB1dCBhY3Rpdml0eSBmb3JtJywgdHJpZ2dlcjogJ2JsdXInIH0sXG4gIF0sXG59KVxuXG5jb25zdCBzdWJtaXRGb3JtID0gYXN5bmMgKGZvcm1FbDogRm9ybUluc3RhbmNlIHwgdW5kZWZpbmVkKSA9PiB7XG4gIGlmICghZm9ybUVsKSByZXR1cm5cbiAgYXdhaXQgZm9ybUVsLnZhbGlkYXRlKCh2YWxpZCwgZmllbGRzKSA9PiB7XG4gICAgaWYgKHZhbGlkKSB7XG4gICAgICBjb25zb2xlLmxvZygnc3VibWl0IScpXG4gICAgfSBlbHNlIHtcbiAgICAgIGNvbnNvbGUubG9nKCdlcnJvciBzdWJtaXQhJywgZmllbGRzKVxuICAgIH1cbiAgfSlcbn1cblxuY29uc3QgcmVzZXRGb3JtID0gKGZvcm1FbDogRm9ybUluc3RhbmNlIHwgdW5kZWZpbmVkKSA9PiB7XG4gIGlmICghZm9ybUVsKSByZXR1cm5cbiAgZm9ybUVsLnJlc2V0RmllbGRzKClcbn1cblxuY29uc3Qgb3B0aW9ucyA9IEFycmF5LmZyb20oeyBsZW5ndGg6IDEwMDAwIH0pLm1hcCgoXywgaWR4KSA9PiAoe1xuICB2YWx1ZTogYCR7aWR4ICsgMX1gLFxuICBsYWJlbDogYCR7aWR4ICsgMX1gLFxufSkpXG48L3NjcmlwdD5cbiIsImltcG9ydC1tYXAuanNvbiI6IntcbiAgXCJpbXBvcnRzXCI6IHt9XG59IiwidHNjb25maWcuanNvbiI6IntcbiAgXCJjb21waWxlck9wdGlvbnNcIjoge1xuICAgIFwiYWxsb3dKc1wiOiB0cnVlLFxuICAgIFwiY2hlY2tKc1wiOiB0cnVlLFxuICAgIFwianN4XCI6IFwicHJlc2VydmVcIixcbiAgICBcInRhcmdldFwiOiBcIkVTTmV4dFwiLFxuICAgIFwibW9kdWxlXCI6IFwiRVNOZXh0XCIsXG4gICAgXCJtb2R1bGVSZXNvbHV0aW9uXCI6IFwiQnVuZGxlclwiLFxuICAgIFwiYWxsb3dJbXBvcnRpbmdUc0V4dGVuc2lvbnNcIjogdHJ1ZSxcbiAgICBcInR5cGVzXCI6IFtcImVsZW1lbnQtcGx1cy9nbG9iYWwuZC50c1wiXVxuICB9LFxuICBcInZ1ZUNvbXBpbGVyT3B0aW9uc1wiOiB7XG4gICAgXCJ0YXJnZXRcIjogMy4zXG4gIH1cbn1cbiIsIl9vIjp7fX0=

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/IT小白/article/detail/438255
推荐阅读
相关标签

Copyright © 2003-2013 www.wpsshop.cn 版权所有，并保留所有权利。

  

闽ICP备14008679号