[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"article-public-TnvWfP4t":3,"public-project-articles-TnvWfP4t":17},{"id":4,"uuid":5,"project_id":6,"title":7,"content":8,"type":9,"status":10,"public_enabled":10,"views":11,"sort":12,"created_at":13,"updated_at":14,"project_title":15,"project_slug":16},63,"TnvWfP4t",38,"06. 开发普通用户注册功能","\n# 先写页面\n\n## 自定义的校验规则\n\n```java\nconst validatePass = (rule, value, callback) => {\n    if (!value) {\n      callback(new Error('请确认密码'))\n    } else if (value !== data.form.password) {\n      callback(new Error('两次输入密码不一致'))\n    } else {\n      callback()\n    }\n}\n```\n\n![image.png](https:\u002F\u002Fcdn.nlark.com\u002Fyuque\u002F0\u002F2023\u002Fpng\u002F751015\u002F1701786408718-e145a404-8e93-4192-9054-42cf78c0ee34.png#averageHue=%23312b2b&clientId=u84bd2d46-e0ab-4&from=paste&height=547&id=u4265d789&originHeight=684&originWidth=900&originalType=binary&ratio=1.25&rotation=0&showTitle=false&size=68249&status=done&style=none&taskId=u95c215c4-ca39-48ea-9d09-ef59fb906a2&title=&width=720)\n\n## 注册函数\n\n![image.png](https:\u002F\u002Fcdn.nlark.com\u002Fyuque\u002F0\u002F2023\u002Fpng\u002F751015\u002F1701786473848-c84fec2f-82ea-4834-a30b-9630c10ffb06.png#averageHue=%232c2c2c&clientId=u84bd2d46-e0ab-4&from=paste&height=415&id=u6d4ab725&originHeight=519&originWidth=889&originalType=binary&ratio=1.25&rotation=0&showTitle=false&size=52933&status=done&style=none&taskId=u896f75d1-46dd-477c-8c7e-bb173f8162b&title=&width=711.2)\n\n# 开发后台接口\n\n```java\n@PostMapping(\"\u002Fregister\")\npublic Result register(@RequestBody User user) {\n    if (RoleEnum.USER.name().equals(user.getRole())) {\n        userService.register(user);\n    } else {\n        return Result.error(\"您的参数输入错误\");\n    }\n    return Result.success();\n}\n```\n\n```java\n\u002F**\n * 注册\n *\u002F\npublic void register(User user) {\n    \u002F\u002F 1. 校验用户账号是否存在\n    User dbUser = userMapper.selectByUsername(user.getUsername());\n    if (dbUser != null) {\n        throw new CustomException(\"账号已存在\");\n    }\n    \u002F\u002F 校验密码是否为空\n    if (ObjectUtil.isEmpty(user.getPassword())) {\n        throw new CustomException(\"密码不能为空\");\n    }\n    if (ObjectUtil.isEmpty(user.getName())) {\n        user.setName(user.getUsername());  \u002F\u002F 设置用户的名称为账号名称\n    }\n    userMapper.insert(user);\n}\n```\n\n新增用户的sql\n\n```xml\n\u003Cinsert id=\"insert\">\n    insert into user (username, password, name, avatar, role, sex, phone)\n    values (#{username}, #{password}, #{name}, #{avatar}, #{role}, #{sex}, #{phone})\n\u003C\u002Finsert>\n```\n\n# 对接数据\n\n调用后台接口\n\n```vue\n\u002F\u002F 点击登录按钮的时候会触发这个方法\n  const login = () => {\n    formRef.value.validate((valid => {\n      if (valid) {\n        \u002F\u002F 调用后台的接口\n        request.post('\u002Flogin', data.form).then(res => {\n          if (res.code === '200') {\n            ElMessage.success(\"登录成功\")\n            router.push('\u002F')\n            localStorage.setItem('canteen-user', JSON.stringify(res.data))\n          } else {\n            ElMessage.error(res.msg)\n          }\n        })\n      }\n    })).catch(error => {\n      console.error(error)\n    })\n  }\n\n```\n\n# 典中典错误\n\n**Invalid bound statement (not found): com.example.mapper.UserMapper.insert**\n![image.png](https:\u002F\u002Fcdn.nlark.com\u002Fyuque\u002F0\u002F2023\u002Fpng\u002F751015\u002F1701787116811-bee1e92c-9646-4d58-a0c2-d2753c18b6c0.png#averageHue=%23312f2e&clientId=u84bd2d46-e0ab-4&from=paste&height=313&id=ud25536e1&originHeight=391&originWidth=1496&originalType=binary&ratio=1.25&rotation=0&showTitle=false&size=125257&status=done&style=none&taskId=ubc71bab6-6114-4814-a43b-1ebb34f6511&title=&width=1196.8)\n![image.png](https:\u002F\u002Fcdn.nlark.com\u002Fyuque\u002F0\u002F2023\u002Fpng\u002F751015\u002F1701787281819-f6fb0d50-bec7-4bca-bc1c-f9f9ebaf0fdd.png#averageHue=%23645742&clientId=u84bd2d46-e0ab-4&from=paste&height=305&id=u22d2f4ab&originHeight=381&originWidth=1581&originalType=binary&ratio=1.25&rotation=0&showTitle=false&size=68320&status=done&style=none&taskId=ue007fe29-912a-4ed3-b784-b93c53e5272&title=&width=1264.8)","coding",1,861,107,"2024-04-16 02:29:23","2026-05-03 22:49:02","SpringBoot3+Vue3的在线点餐系统","online-ordering",{"project":18,"items":19},{"id":6,"title":15,"slug":16},[20,27,34,41,48,55,56,63,70,77,84,91,98,105,112,119],{"id":21,"uuid":22,"project_id":6,"title":23,"type":9,"status":10,"public_enabled":10,"views":24,"sort":25,"created_at":26,"updated_at":14,"project_title":15,"project_slug":16},58,"JOJVoOQd","01. 在线点餐系统介绍",2745,102,"2025-01-09 09:49:39",{"id":28,"uuid":29,"project_id":6,"title":30,"type":9,"status":10,"public_enabled":10,"views":31,"sort":32,"created_at":33,"updated_at":14,"project_title":15,"project_slug":16},59,"Tt7tzqbb","02. 脚手架介绍",2364,103,"2025-01-09 09:54:51",{"id":35,"uuid":36,"project_id":6,"title":37,"type":9,"status":10,"public_enabled":10,"views":38,"sort":39,"created_at":40,"updated_at":14,"project_title":15,"project_slug":16},60,"h74qSg8n","03. 开发登录功能",1974,104,"2024-04-16 02:30:00",{"id":42,"uuid":43,"project_id":6,"title":44,"type":9,"status":10,"public_enabled":10,"views":45,"sort":46,"created_at":47,"updated_at":14,"project_title":15,"project_slug":16},61,"uv8MFWZg","04. 开发后台登录接口",1729,105,"2024-04-16 02:29:56",{"id":49,"uuid":50,"project_id":6,"title":51,"type":9,"status":10,"public_enabled":10,"views":52,"sort":53,"created_at":54,"updated_at":14,"project_title":15,"project_slug":16},62,"jd2xjxUG","05. 开发普通用户登录功能",1145,106,"2024-04-16 02:29:27",{"id":4,"uuid":5,"project_id":6,"title":7,"type":9,"status":10,"public_enabled":10,"views":11,"sort":12,"created_at":13,"updated_at":14,"project_title":15,"project_slug":16},{"id":57,"uuid":58,"project_id":6,"title":59,"type":9,"status":10,"public_enabled":10,"views":60,"sort":61,"created_at":62,"updated_at":14,"project_title":15,"project_slug":16},64,"j9QNZGZU","07. 开发管理员后台接口",873,108,"2024-04-16 02:29:17",{"id":64,"uuid":65,"project_id":6,"title":66,"type":9,"status":10,"public_enabled":10,"views":67,"sort":68,"created_at":69,"updated_at":14,"project_title":15,"project_slug":16},65,"Sle0aiDs","08. 开发管理员管理页面并对接后台接口",821,109,"2024-04-16 02:29:13",{"id":71,"uuid":72,"project_id":6,"title":73,"type":9,"status":10,"public_enabled":10,"views":74,"sort":75,"created_at":76,"updated_at":14,"project_title":15,"project_slug":16},66,"msAf9SFh","09. 开发文件上传功能",659,110,"2024-04-16 02:29:09",{"id":78,"uuid":79,"project_id":6,"title":80,"type":9,"status":10,"public_enabled":10,"views":81,"sort":82,"created_at":83,"updated_at":14,"project_title":15,"project_slug":16},67,"8FBiQ4ue","10. 个人资料管理",736,111,"2024-04-16 02:29:06",{"id":85,"uuid":86,"project_id":6,"title":87,"type":9,"status":10,"public_enabled":10,"views":88,"sort":89,"created_at":90,"updated_at":14,"project_title":15,"project_slug":16},252,"hi7dGSTj","11. 顾客信息管理",643,431,"2024-06-20 15:59:16",{"id":92,"uuid":93,"project_id":6,"title":94,"type":9,"status":10,"public_enabled":10,"views":95,"sort":96,"created_at":97,"updated_at":14,"project_title":15,"project_slug":16},253,"2vquH0pr","12. 餐桌管理",879,432,"2024-06-03 22:12:16",{"id":99,"uuid":100,"project_id":6,"title":101,"type":9,"status":10,"public_enabled":10,"views":102,"sort":103,"created_at":104,"updated_at":14,"project_title":15,"project_slug":16},254,"F8DqfdBe","13. 开发餐品管理功能.",731,433,"2024-06-03 22:12:43",{"id":106,"uuid":107,"project_id":6,"title":108,"type":9,"status":10,"public_enabled":10,"views":109,"sort":110,"created_at":111,"updated_at":14,"project_title":15,"project_slug":16},275,"G20uzwaW","14. 开发在线点餐功能（一）",768,467,"2024-06-27 12:21:02",{"id":113,"uuid":114,"project_id":6,"title":115,"type":9,"status":10,"public_enabled":10,"views":116,"sort":117,"created_at":118,"updated_at":14,"project_title":15,"project_slug":16},276,"0bl3zvbT","15. 开发在线点餐功能（二）",609,468,"2024-06-27 12:21:30",{"id":120,"uuid":121,"project_id":6,"title":122,"type":9,"status":10,"public_enabled":10,"views":123,"sort":124,"created_at":125,"updated_at":14,"project_title":15,"project_slug":16},277,"AUgPvs9x","16. 开发在线点餐功能（三）",716,469,"2024-06-27 12:22:01"]