- 博客(30)
- 收藏
- 关注
RSS订阅原创 router路由与页面信息不同步问题解决方案
通过watch监听route里的id，当id发生改变的时候，那说明页面内容页需要改变。当日后遇到所有一个变，其他没有跟着变的问题。但是发现，仅仅是路由改变了。但是页面的内容却没改变。该问题的主要原因是没有把route中id的改变与页面内容关联在一起。最开始二者关联的原因是页面刚加载的时候路由和内容在时间上达到了同步。路由改变不会触发内容改变。页面中信息是根据路由中携带的id查询出来的。在推荐界面，点击页面跳转到对应的推荐详情页。所以解决问题的关键在于将二者关联起来。这个问题的主要症结在于没有数据关联。
2025-02-22 08:42:56
206
原创 Mybatis后端数据库查询多对多查询解决方案
在创建paper表，存储course，可以将course存储为一个字符串，用指定的分隔符分割。增加paper的时候，只需要获取到paperId和courses数组中的courseId然后调用paper_course中间表的添加操作即可。如果面对团队合作，这种方法十分受限，因为别人不知道，甚至有一天自己都忘了自己设置的分割符是什么了。这个定义了我要的resultType，因为刚刚说了，我要保证我能接受到结果数组。其实这个无需担心，你只需要先插入paper，然后你在paper里就可以拿到了。
2025-02-17 21:28:40
983
原创 [vue3 element-plus]当事件需要传递多个参数的变化写法
但是因为checkbox是用v-for渲染的，所以我还要知道我拿到了哪个check-box。通过el-checkbox我们可以通过默认参数获得是否选择。这时候，我们就要多传一个参数，用于获取哪个check-box。我们之间就可以拿到checkbox是否check的值。那怎么写能既保留默认参数,并且传递额外的参数呢?如果我们这样写，会直接覆盖默认参数。单选框使用el-checkbox。通过这种写法可以保留默认参数。需要完成购物车的单选功能。
2024-10-29 12:06:13
528
原创 [vue pinia]业务实现:401报错 token失效后异常处理
如果token错了，会导致请求失败，数据加载不对，这是严重的bug，所以我们要对这种错误进行处理。状态码由自己的数据结构而定，当识别的401响应后，清除本地用户数据并跳转登录页。当然不能一个一个响应的处理，应该在响应拦截器中一起处理。后端生成的token一段时间后会过期。
2024-10-24 17:23:15
273
原创 [算法刷题 c++]135.分发糖果(左右拆分思想)
此题让人迷惑之处在于，遍历数组时，当前孩子需要分发的糖果既与左边孩子有关，右与右边孩子有关。这让中间的值变得不确定。甚至还有可能因为当前值的不同去修改前一个值。我们想想看，每一个孩子，如果左边的孩子分数少，那么他就应该比左边孩子多一个。如果右边的孩子比他少，他也应该比右边的孩子多一个。通过数组记录左规则和右规则。在一次遍历即可计算出来最后的结果。请你给每个孩子分发糖果，计算并返回需要准备的。关键点在于把左规则和右规则分离，我称之为。表示每个孩子的评分。
2024-10-19 15:22:38
401
原创 [算法刷题 c++]力扣42.接雨水(左右拆分思想)
我觉得正确的方法是先用暴力，然后看暴力思路中有什么可以优化的点，比如空间换时间，重复没必要遍历优化等等。如果暴力遍历，也就是遍历数组，左边右边分别找最高的，然后计算。那么遍历两次，时间复杂度就是O(n^2)这是不行的，太慢了。我们先想一想，我们如果挨个柱子遍历，确定一个柱子最多能接多少水，其实取决于这根柱子。如果我们可以在每次遍历就直接知道左边最高和右边最高是不是就可以压缩到O(n)了。如果当前数组的值和左侧右侧都有关系，那么就用两个数组来记录。的柱子的高度图，计算按此排列的柱子，下雨之后能接多少雨水。
2024-10-19 15:14:07
307
原创 [vue elementUI]表单校验
规则的触发条件其实是双向绑定着el-input,el-checkbox的值,如果值变化的话,就触发校验条件。如果你想监听非表格上的值，那就需要自己写一个watch监听数值，进行手动的双向绑定了。你的表单虽然获得了校验规则,但是他并不知道,哪一条字段对应着哪一条规则。使用elementUI中的<el-form>表单，实现表单检验功能。然后你要将规则挂载到你的form表单上。要实现这个功能，有三个要素。为表单的rules属性赋值。首先你要有校验表达的规则。使用prop字段绑定规则。规则中的属性在注释介绍。
2024-10-17 11:14:39
260
原创 [vue elementUI]功能实现:溢出内容展示为省略号(...)鼠标浮动tooltip查看内容
主要是获取dom元素中的省略号内容和非省略内容。通过比较他们的长度关系来判断是否溢出。当内容超过宽度时，溢出内容用省略号展示，鼠标辅导在内容上时，tooltip显示内容。tooltip在elementUI中有现成的实现。而我用的是自己写的组件。主要是通过slot插槽获得要展示的容器，鼠标浮动用绝对定位的盒子展示内容。主要看一下只在溢出时展示tooltip的逻辑。如果溢出则展示内容，不溢出则不展示。给容器添加tooltip。给容器添加css标签。
2024-10-14 12:56:59
346
原创 [vue]全局注册组件
在开发中我们有一些基础组件非常的常用，每一次用的话都import导入未免感觉麻烦。这样我们使用这些注册的全局组件时,就不用import导入了,直接使用即可。我们可以通过install(app),来注册全局组件。在自定义指令的时候，我们通过app实现了全局的注册。在要注册的文件下创建一个js文件作为注册的入口。在main.js中注册。
2024-10-13 18:14:01
249
原创 [vue3 JavaScript CSS]实现电商网站商品预览,图片放大镜功能
而右侧大图的back-ground-size为800px*800px是正常图片的二倍，实现放大效果。这里需要仔细理解一下，小滑块长200px，而我们的需要将小滑块的中心吸附在鼠标上，那么小滑块的left和top都要减去小滑块高度的一半。你的鼠标吸附的是蒙层。我们忽略下方的小图列表，我们为蒙层绑定了一个动态的css，通过left和top来控制蒙层小滑块。我们通过解析表达来获取所需要的数据，注意我们获取到的数据都是响应式的，会动态变化。放大的图片是二倍显示，那么移动的距离自然也应该是二倍。
2024-10-13 16:43:53
1389
原创 [前端工具]vue2框架实现perfect-scrollbar简单使用
完美滚动条 (Perfect Scrollbar) 是一个轻量级的 JavaScript 库，用于创建美观且功能丰富的自定义滚动条，它在现代浏览器中提供了一个优雅的解决方案来替代默认的系统滚动条。这个库支持多种定制选项，包括对触摸设备的支持，非常适合那些寻求增强用户体验的Web开发。
2024-10-12 12:36:54
543
原创 [浏览器 项目调试]如何定位请求的数据
我想看一眼一个已经上线的功能后端返回的数据是什么。看一看后端的数据结构是什么样的。VScode新建一个json文件，将字符串拷贝到文件中。ctrl+A全选Response中的JSON字符串。首先F12打开浏览器调试工具点击network。Shift+Alt+F格式化json文件。这样就得到一个观感很好的JSON文件了。我想在其中找一个字段,实在太麻烦了。找到XHR过滤发送的Ajax请求。今天在工作中遇到了一个问题。查找你想找的字段就可以了。
2024-10-09 13:27:22
373
原创 [vue vue-router]解决路由缓存问题
vue官方给出的解释是，为了复用更加高效，使用带有参数的路由会被重复使用，而不会被销毁再创建。这样固然更加高效，但是意味着生命周期钩子函数不会被调用。这就意味着，写到setup，onMounted钩子里的数据更新函数不会被调用而导致数据无法更新。
2024-10-08 17:04:08
689
原创 [vue vue-router]vue3路由获取请求参数
在请求数据的时候，后端需要传入id获取数据，这里的http是我封装的axios。在使用vue路由的时候，比如有一个tab栏，点击tab栏不同的tab切换。使用RouterLink标签配置路由，将参数传入路由路径中。在配置二级路由时，不把id写死，作为路由参数站位。当鼠标悬浮的时候，左下角显示路径。通过vue3的API拿到路由参数。测试通过，数据获取成功。
2024-10-08 15:54:21
918
原创 [生活感悟]学习编程中，“记录”的重要性
在我走路的时候，我把书包放在异空间里，而当我需要的时候，从空间里拿出来。并且如果有和我一样的人在找资料，也能被提醒到，那多好啊。你吃一口药，你的血量就回复50。如果你也想做这样的事，欢迎联系我。一个人是可以走的很快，但是一群人才能走的更远。如果天天要你起早，可能一周以后，就会不断怀疑自己做的对吗？我以前从来不用git，因为配着配着，出了错误，我一直懒得解决。你打到哪里了，你打过哪一关了，获得什么奖励，取得过什么成就。我之前配环境，搭建项目，每一次都像第一次搭。你写了代码，你修改了bug，通通被记录下来。
2024-10-07 17:57:32
365
原创 [vue 具名插槽]在v-for渲染时,插槽无法正确识别内容导致显示异常
开发中，使用v-for渲染带插槽的组件，由于只有一个插槽，最初没有使用具名插槽，结果插槽却插入失败。原因可能是由于v-for渲染，出现了多个插槽，导致无法识别，所以渲染失效了。但是当我使用v-for进行组件渲染时，插槽插入的内容就怎么也渲染不上了。虽然我写的是具名插槽，但是使用组件时不需要指定名字也可以成功渲染。使用具名插槽语法成功解决问题。
2024-10-07 17:08:53
502
原创 [vue3]自定义指令实现图片的懒加载
官方文档-自定义指令官方示例// 在模板中启用 v-focusfocus指令钩子：// 在绑定元素的 attribute 前// 或事件监听器应用前调用// 下面会介绍各个参数的细节},// 在元素被插入到 DOM 前调用// 在绑定元素的父组件// 及他自己的所有子节点都挂载完成后调用// 绑定元素的父组件更新前调用// 在绑定元素的父组件// 及他自己的所有子节点都更新后调用// 绑定元素的父组件卸载前调用// 绑定元素的父组件卸载后调用el：指令绑定到的元素。
2024-10-07 16:17:09
1135
原创 [vue]通过vueuse实现头部导航栏固定效果
监听页面滚动的距离，如果距离大于某一值。则给我们的组件添加show类名，展示组件，否则隐藏组件。那么如何获取到滚动的距离呢？我这里使用的是vueuse库里面的一个函数。当组件没有show时，不展示，当滚动到相应距离时，添加show类名，展示组件。实现在浏览网页时，用户滚动页面到导航栏下时，导航栏固定在头部的效果。最终的实现代码，也就是获取y的值，如果大于某个值则添加类名。我们再写一个fixup组件，添加一个show类名。大家可以直接到官方文档查看，真的是一目了然。
2024-10-06 10:39:58
555
原创 [解决报错]java: 源发行版 17 与 --enable-preview 一起使用时无效 （仅发行版 21 支持预览语言功能）
其实最终的配置还是在maven配置中，只需要修改maven的配置就好啦。最开始尝试修改项目配置和编译器配置，但是都没用。构建时,提示源发行版17与21使用无效。将17修改为21即可。
2024-10-04 15:34:34
1024
原创 [java Springboot]处理全局异常
通过@RestControllerAdvice注解和@ExceptionHandler注解,返回特定格式的错误信息。新建一个java类 GlobalExcetionHandler。当出现异常报错时,希望将报错信息以规定的格式返回给前端。如果出现异常我们希望返回给前端指定格式的Result。代码中的注释是生成get set方法的。这个类返回状态码，1为成功，0为失败。我们定义一个Result类。
2024-10-04 15:22:47
272
1
原创 [java Springboot]接口校验Validation
添加@Validated注解,在需要校验的字段前添加@pattern注解。在@pattern中,添加要校验的正则表达式即可。假如你需要校验用户名和密码。
2024-10-04 15:18:05
255
原创 [java SpringBoot]Bean对象注册
前置条件:创建一个Spring项目,有Spring框架的支持Spring中启动类的实现了包扫描。在Spring项目构建时，Spring会扫描所在目录下的包，扫描包下@Component注解管理的Bean对象,将Bean对象添加到IOC容器中。好处是什么呢？在项目中如果使用到这个Bean对象，可以直接通过依赖注入来使用，而不是需要一个一个new出来。通过下述代码,我们在操作数据库的时候,可以直接通过@Autowired依赖注入来调用Mapper的方法,非常的方便。
2024-10-03 12:29:29
943
原创 [Java springboot]yml配置信息书写与获取
SpringBoot中提供了多中属性配置方式相比于application.properties,application.yml/application.yaml拥有着层次清晰的优势。
2024-10-03 00:12:09
279
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人