- 博客(62)
- 收藏
- 关注
RSS订阅原创 使用AI一步一步实现若依(29)
采用经典的RBAC（基于角色的访问控制）用户：系统使用者（如：张三、李四）角色：权限集合（如：管理员、新员工）菜单：具体操作菜单（如：用户管理、新员工培训）
2025-03-29 18:04:02
744
原创 使用AI一步一步实现若依(28)
JWT（JSON Web Token）是一种基于Token的轻量级认证协议，由 RFC 7519 规范定义。其核心思想是：•无状态：服务端无需存储 Token，认证信息通过加密签名直接嵌入 Token 中。•自包含性：Token 本身包含用户身份、权限等关键数据，服务端只需验证签名即可信任内容。•跨域友好：通过 HTTP Header（如）传递，天然支持跨域场景。Token 结构JWT 由三部分组成，以•Header：声明 Token 类型（typ: "JWT"）和签名算法（如。
2025-03-27 15:49:29
661
原创 使用AI一步一步实现若依(25)
前言实现角色管理的前端+后端增改查功能，暂时不实现删除。一.操作步骤1.Controllersrc/main/java/com/ruoyi/web/controller/system/SysRoleController.java2.Servicesrc/main/java/com/ruoyi/system/service/ISysRoleService.javasrc/main/java/com/ruoyi/system/service/impl/SysRoleServiceImpl.java
2025-03-26 14:33:39
387
原创 使用AI一步一步实现若依(24)
前言实现菜单管理的前端+后端增改查功能，暂时不实现删除。src/main/java/com/ruoyi/web/controller/system/SysMenuController.java前端2.APIsrc\api\system\menu.js3.修改模板src\views\system\menu\index.vue4.优化BUG在开发过程中，随着功能的添加，之前实现的代码会产生一些bug，随功能一起优化代码。src\components\IconSelect\index.vues
2025-03-26 09:04:32
521
原创 使用AI一步一步实现若依(23)
menu_id bigint(20) not null auto_increment comment '菜单ID',menu_name varchar(50) not null comment '菜单名称',parent_id bigint(20) default 0 comment '父菜单ID',order_num int(4) default 0 comment '显示顺序',path varchar(200) default '' comment '路由地址',
2025-03-25 22:32:11
939
原创 使用AI一步一步实现若依(22)
前后端实现基础增删改查功能。新建文件：src/main/java/com/ruoyi/common/constant/HttpStatus.java/*** 操作成功*//*** 对象创建成功*//*** 请求已经被接受*//*** 操作已经执行成功，但是没有返回数据*//*** 资源已被移除*//*** 重定向*//*** 资源没有被修改*//*** 参数列表错误（缺少，格式不匹配）*//*** 未授权*//**
2025-03-24 16:41:56
198
原创 使用AI一步一步实现若依(21)
Axios 是一个基于 Promise 的现代化 HTTP 客户端库，广泛应用于浏览器和 Node.js 环境。它简化了前端与后端的数据交互，具备拦截器、自动 JSON 转换、请求取消等强大功能，成为替代原生 fetch 的热门选择。新建文件：src\utils\request.js// 创建axios实例// axios中请求配置有baseURL选项，表示请求URL公共部分// 超时headers: {})// 响应拦截器},error => {
2025-03-23 21:52:58
452
原创 使用AI一步一步实现若依(20)
MyBatis-Plus 的分页插件提供了强大的分页功能，支持多种数据库（如 MySQL、Oracle、PostgreSQL），通过简单的配置即可实现高效的分页查询。MyBatis-Plus 的分页功能具有以下优势：•无侵入性：无需修改原有 Mapper 接口和 SQL 语句。•自动化处理：自动拼接COUNT查询语句，计算总记录数。•多数据库支持：通过DbType配置适配不同数据库方言。•与 Spring Boot 深度整合：通过 Starter 依赖快速集成。POJO自动绑定。
2025-03-22 21:37:14
1097
原创 使用AI一步一步实现若依(19)
user_id bigint(20) not null auto_increment comment '用户ID',dept_id bigint(20) default null comment '部门ID',user_name varchar(30) not null comment '用户账号',nick_name varchar(30) not null comment '用户昵称',
2025-03-21 12:29:49
885
原创 使用AI一步一步实现若依前端(17)
前言一.操作步骤1.菜单管理新建文件src\views\system\menu\index.vue2.修改文件src\api\system\menu.js造一些数据，用于页面的静态展示。3.自定义组件新建文件src\components\DictTag\index.vue新建文件src\components\IconSelect\index.vue新建辅助文件src\components\IconSelect\requireIcons.js4.修改src\utils\ruoyi.js增
2025-03-20 12:34:17
952
原创 使用AI一步一步实现若依前端(16)
前言页面静态展示。新建文件src\views\system\role\index.vue2.请求接口新建文件src\api\system\role.js，管理角色页面里用到的所有接口。新建文件src\api\system\menu.js，管理菜单页面里用到的所有接口。二.功能验证运行项目，浏览器访问http://localhost:5173/system/role
2025-03-20 11:26:26
466
原创 使用AI一步一步实现若依前端(15)
前言只完成页面的静态展示。按钮的功能大多数都涉及和后端交互，待后续接入后端再实现。新建文件src\views\system\user\index.vue2.请求接口新建文件src\api\system\user.js，封装所有该页面使用到的网络请求接口。暂时模拟一些静态数据。3.安装依赖 是一个用于 创建可拖拽调整大小的面板布局 的 Vue 组件库。4.自定义分页组件新建文件src\components\Pagination\index.vue5.自定义toolbar组件新建文件src\c
2025-03-20 09:55:38
425
原创 JavaScript 函数类型详解：函数声明、函数表达式、箭头函数
定义：直接通过function关键字声明函数。特点：函数名会被提升到作用域顶部，允许“先调用后定义”。// 函数声明函数类型核心优势注意事项函数声明提升特性，适合工具函数避免在块级作用域内使用（如if函数表达式灵活赋值，适合动态逻辑注意const不可重新赋值箭头函数简洁安全，适合回调函数避免用于对象方法和构造函数。
2025-03-18 21:07:14
463
原创 使用AI一步一步实现若依前端(14)
在自动将 SVG 文件转换为可复用的<symbol>图标运行时动态加载 SVG 图标通过<use>标签高效复用图标<template></svg>},color: {})${`)</script>width: 1em;</style>
2025-03-13 16:27:07
1063
原创 使用AI一步一步实现若依前端(13)
用于在侧边栏顶部显示logo图片和文字。支持折叠和展开。// 获取Logo背景色 const getLogoBackground = '#304156' // 获取Logo文字颜色 const getLogoTextColor = '#ffffff' </ script > < style lang = " scss " scoped > .sidebarLogoFade-enter-active {margin : 0;
2025-03-13 13:13:29
785
原创 使用AI一步一步实现若依前端(12)
前言el-menu提供了侧边栏的折叠属性collapse，可以水平折叠收起菜单。定义appStore，保存控制侧边栏状态的相关信息。showSidebar ：false侧边栏展开，true侧边栏折叠。sidebarWidth ：展开时的组件宽度。2.修改Navbar.vue在面包屑前，增加一个图标，点击图标会触发appStore里的状态变化，实现侧边栏折叠和展开。3.修改Sidebar.vue将el-menu的collapse属性绑定到appstore的showSidebar，响应式的控制侧边
2025-03-13 11:10:41
1076
原创 使用AI一步一步实现若依前端(10)
给不需要显示的对象设置hidden属性，例如登录页。给首页增加meta属性。export这个初始化的路由数组，后面需要跟服务端返回的动态数组合并。},path: '/',meta: { title: '首页', icon: 'House', affix: true },meta: { title: '首页', icon: 'House', affix: true }
2025-03-12 10:50:35
1095
原创 使用AI一步一步实现若依前端(8)
在项目中，我们规定只有首页（/login），是不需要用户登录，就可以正常访问的。其他页面，都需要登录才能访问。如果用户在没有登录时，直接访问http://localhost:5173/index，就会被重定向到登录页。用户的登录状态，统一保存在userStore里。新建文件：src/stores/user.js// 异步操作return {login})新建文件：src/stores/permission.js将请求getRouters接口和处理返回结果的逻辑，都放在该Store里。
2025-03-11 16:05:32
716
原创 使用AI一步一步实现若依前端(7)
前言在若依里，addRoute方法是在前置守卫里被调用的。要能实现在浏览器刷新后，能重新从后端服务器获取数据再动态添加。处理逻辑如下：浏览器刷新前置守卫Pinia后端API路由器浏览器触发 beforeEach检查权限数据数据已丢失重新获取权限返回权限数据addRoute 动态路由完成路由跳转浏览器刷新前置守卫Pinia后端API路由器浏览器不能像昨天的代码那样，在layout/index.vue这个地方调用。会导致浏览器刷新后，动态添加的路由记录丢失。在 Vue Router 中通过 注册全局前置守
2025-03-11 10:41:28
807
原创 使用AI一步一步实现若依前端(6)
前言昨天点击菜单后，没有得到预期结果的页面展示效果。是因为Router里没有对应的路由记录。从开发工具可以看到当前的路由记录。就只有在src/router/index.js文件里配置的和是 Vue Router 4.x 中动态添加路由的核心方法，主要用于实现权限路由、按需加载等场景。方法的入参格式，可以参考路由配置文件里面的首页配置。需要重点关注两个component属性，值要对应到具体的资源对象。2.解析getRouters接口的返回结果“component”: “Layout”一级折叠
2025-03-11 09:08:39
940
原创 使用AI一步一步实现若依前端(5)
在若依中，侧边栏显示的菜单项，是根据登录用户的角色动态显示的。不同角色的用户，看到的菜单可能是不一样的。这就需要在代码中，能根据后端服务器返回的结果，动态显示菜单项。前端领域的「潜规则」•HTML 属性：HTML 规范要求属性名全小写（比如），若强行写驼峰形式会被当作字符串属性。•JS 属性：JavaScript 习惯用驼峰命名变量（如menuData），写短横线形式menu-data需要加引号，不符合代码审美。于是 Vue 在中间做了自动翻译。
2025-03-10 17:11:44
737
原创 使用AI一步一步实现若依前端(4)
Layout布局的效果。在侧边栏点击不同菜单，只有红框里的内容会对应改变。整个页面是父路由的component渲染，红框是子路由的component渲染。
2025-03-10 12:25:30
1026
原创 JS中的浅拷贝和深拷贝
纯基本类型数组：任意浅拷贝方法均可满足需求。包含引用类型的数组• 优先使用• 简单数据可用JSON序列化• 避免直接修改嵌套引用对象通过合理选择拷贝方式，可以确保数组操作的独立性，避免意外的副作用。
2025-03-08 09:54:29
263
原创 Vue Router 导航守卫详解：从原理到实战
导航守卫是 Vue Router 的核心控制机制，它像交通信号灯一样管理着路由跳转的每个环节。本文将用通俗易懂的方式讲解 5 类导航守卫，并通过一个完整的电商平台案例演示它们的配合使用。
2025-03-05 13:05:53
429
原创 pnpm add和pnpm install指定包名安装的区别
时使用（例如测试某个包的兼容性）。但这种情况较为少见，且容易导致团队协作时的依赖缺失问题。它能明确表达“添加新依赖”的意图，并自动更新。当需要将包作为项目依赖持久化时，始终使用。，除非你明确知道不需要记录依赖！，避免遗漏依赖记录。仅当需要临时安装包且。
2025-03-05 09:27:23
454
原创 为何在用户注销时使用 location.href 而非 Vue Router 的 router.push
方案适用场景优点缺点需彻底清理状态、依赖后端响应、强化安全性状态彻底重置，逻辑可靠页面刷新，体验中断保持 SPA 流畅体验、目标为纯前端路由无缝跳转，用户体验佳需手动清理，维护成本高选择跳转方式时，需根据项目需求权衡安全性与用户体验。在涉及敏感操作（如注销）时，优先选择以降低风险；在普通页面跳转中，则可利用提升流畅性。最终目标是为用户提供既安全又舒适的操作体验。
2025-03-03 19:45:11
638
1
原创 JavaScript 数组的 some() 函数：语法、用法与实战示例
存在性检查：快速判断数组是否包含符合条件的元素。短路特性：找到第一个匹配项后立即终止遍历。纯函数：不修改原数组，适合函数式编程。
2025-03-03 17:53:58
1032
原创 Vue Router 导航守卫中 next({ ...to, replace: true }) 的深入解析
确保动态路由加载完成：通过重新导航更新路由表。优化用户体验：替换历史记录，避免无效的浏览器返回操作。
2025-03-03 17:01:47
1319
原创 深入解析 Vue Router 的 beforeEach：功能、用法与实践指南
beforeEach是 Vue Router 提供的全局前置守卫（Global Before Guards），在路由跳转之前触发。拦截导航：在用户访问某个路由前进行权限校验、数据预加载等操作。控制跳转行为：允许继续导航、重定向到其他页面，或直接中断跳转。登录状态验证动态路由加载（如权限路由）页面访问统计路由切换动画控制功能beforeEach是路由跳转前的拦截器，用于权限控制、动态路由加载等。关键方法next()必须调用，且支持放行、重定向、中断等操作。动态路由：通过。
2025-03-03 16:58:00
1141
原创 如何让 Git 管理本地项目
Git 是最流行的分布式版本控制系统，能够高效管理项目的代码变更历史。以下是将本地项目交给 Git 管理的完整流程，适用于。，绿色显示的文件已进入暂存区，等待提交。
2025-02-26 22:40:02
395
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人